<div class="swiper-container swiper-container-h"> <div class="swiper-wrapper"><div class="swiper-slide"> <picture> <source srcset="https://tomrobison.com/wp-content/uploads/home-lg-2-768x433.jpg" media="(max-width: 768px)"> <source srcset="https://tomrobison.com/wp-content/uploads/home-lg-2-1000x563.jpg" media="(min-width: 769px) and (max-width: 1000px)"> <source srcset="https://tomrobison.com/wp-content/uploads/home-lg-2-1536x865.jpg" media="(min-width: 1001px) and (max-width: 1536px)"> <source srcset="https://tomrobison.com/wp-content/uploads/home-lg-2.jpg" media="(min-width: 1537px)"> <img src="https://tomrobison.com/wp-content/uploads/home-lg-2.jpg" alt=""> </picture></div><div class="swiper-slide"> <picture> <source srcset="https://tomrobison.com/wp-content/uploads/our-story-lg-768x433.jpg" media="(max-width: 768px)"> <source srcset="https://tomrobison.com/wp-content/uploads/our-story-lg-1000x563.jpg" media="(min-width: 769px) and (max-width: 1000px)"> <source srcset="https://tomrobison.com/wp-content/uploads/our-story-lg-1536x865.jpg" media="(min-width: 1001px) and (max-width: 1536px)"> <source srcset="https://tomrobison.com/wp-content/uploads/our-story-lg.jpg" media="(min-width: 1537px)"> <img src="https://tomrobison.com/wp-content/uploads/our-story-lg.jpg" alt=""> </picture></div><div class="swiper-slide"> <picture> <source srcset="https://tomrobison.com/wp-content/uploads/recipes-lg-768x433.jpg" media="(max-width: 768px)"> <source srcset="https://tomrobison.com/wp-content/uploads/recipes-lg-1000x563.jpg" media="(min-width: 769px) and (max-width: 1000px)"> <source srcset="https://tomrobison.com/wp-content/uploads/recipes-lg-1536x865.jpg" media="(min-width: 1001px) and (max-width: 1536px)"> <source srcset="https://tomrobison.com/wp-content/uploads/recipes-lg.jpg" media="(min-width: 1537px)"> <img src="https://tomrobison.com/wp-content/uploads/recipes-lg.jpg" alt=""> </picture></div><div class="swiper-slide"> <picture> <source srcset="https://tomrobison.com/wp-content/uploads/jobs-lg-768x433.jpg" media="(max-width: 768px)"> <source srcset="https://tomrobison.com/wp-content/uploads/jobs-lg-1000x563.jpg" media="(min-width: 769px) and (max-width: 1000px)"> <source srcset="https://tomrobison.com/wp-content/uploads/jobs-lg-1536x865.jpg" media="(min-width: 1001px) and (max-width: 1536px)"> <source srcset="https://tomrobison.com/wp-content/uploads/jobs-lg.jpg" media="(min-width: 1537px)"> <img src="https://tomrobison.com/wp-content/uploads/jobs-lg.jpg" alt=""> </picture></div><div class="swiper-slide"> <picture> <source srcset="https://tomrobison.com/wp-content/uploads/quality-lg-768x433.jpg" media="(max-width: 768px)"> <source srcset="https://tomrobison.com/wp-content/uploads/quality-lg-1000x563.jpg" media="(min-width: 769px) and (max-width: 1000px)"> <source srcset="https://tomrobison.com/wp-content/uploads/quality-lg-1536x865.jpg" media="(min-width: 1001px) and (max-width: 1536px)"> <source srcset="https://tomrobison.com/wp-content/uploads/quality-lg.jpg" media="(min-width: 1537px)"> <img src="https://tomrobison.com/wp-content/uploads/quality-lg.jpg" alt=""> </picture></div></div> </div>

<div class="swiper-container swiper-container-h"> <div class="swiper-wrapper"><div class="swiper-slide"> <picture> <source media="(max-width: 768px)" srcset="https://tomrobison.com/wp-content/uploads/quality-md-1-768x768.jpg" /> <source media="(min-width: 769px) and (max-width: 1000px)" srcset="https://tomrobison.com/wp-content/uploads/quality-md-1-1000x1000.jpg" /> <source media="(min-width: 1001px) and (max-width: 1536px)" srcset="https://tomrobison.com/wp-content/uploads/quality-md-1.jpg" /> <img src="https://tomrobison.com/wp-content/uploads/quality-md-1.jpg" alt="" /> </picture></div><div class="swiper-slide"> <picture> <source media="(max-width: 768px)" srcset="https://tomrobison.com/wp-content/uploads/jobs-md-1-768x768.jpg" /> <source media="(min-width: 769px) and (max-width: 1000px)" srcset="https://tomrobison.com/wp-content/uploads/jobs-md-1-1000x1000.jpg" /> <source media="(min-width: 1001px) and (max-width: 1536px)" srcset="https://tomrobison.com/wp-content/uploads/jobs-md-1.jpg" /> <img src="https://tomrobison.com/wp-content/uploads/jobs-md-1.jpg" alt="" /> </picture></div><div class="swiper-slide"> <picture> <source media="(max-width: 768px)" srcset="https://tomrobison.com/wp-content/uploads/recipes-md-1-768x768.jpg" /> <source media="(min-width: 769px) and (max-width: 1000px)" srcset="https://tomrobison.com/wp-content/uploads/recipes-md-1-1000x1000.jpg" /> <source media="(min-width: 1001px) and (max-width: 1536px)" srcset="https://tomrobison.com/wp-content/uploads/recipes-md-1.jpg" /> <img src="https://tomrobison.com/wp-content/uploads/recipes-md-1.jpg" alt="" /> </picture></div><div class="swiper-slide"> <picture> <source media="(max-width: 768px)" srcset="https://tomrobison.com/wp-content/uploads/our-story-md-768x768.jpg" /> <source media="(min-width: 769px) and (max-width: 1000px)" srcset="https://tomrobison.com/wp-content/uploads/our-story-md-1000x1000.jpg" /> <source media="(min-width: 1001px) and (max-width: 1536px)" srcset="https://tomrobison.com/wp-content/uploads/our-story-md.jpg" /> <img src="https://tomrobison.com/wp-content/uploads/our-story-md.jpg" alt="" /> </picture></div><div class="swiper-slide"> <picture> <source media="(max-width: 768px)" srcset="https://tomrobison.com/wp-content/uploads/home-md-1-1-768x768.jpg" /> <source media="(min-width: 769px) and (max-width: 1000px)" srcset="https://tomrobison.com/wp-content/uploads/home-md-1-1-1000x1000.jpg" /> <source media="(min-width: 1001px) and (max-width: 1536px)" srcset="https://tomrobison.com/wp-content/uploads/home-md-1-1.jpg" /> <img src="https://tomrobison.com/wp-content/uploads/home-md-1-1.jpg" alt="" /> </picture></div><div class="swiper-slide"> <picture> <source media="(max-width: 768px)" srcset="https://tomrobison.com/wp-content/uploads/quality-md-768x768.jpg" /> <source media="(min-width: 769px) and (max-width: 1000px)" srcset="https://tomrobison.com/wp-content/uploads/quality-md-1000x1000.jpg" /> <source media="(min-width: 1001px) and (max-width: 1536px)" srcset="https://tomrobison.com/wp-content/uploads/quality-md.jpg" /> <img src="https://tomrobison.com/wp-content/uploads/quality-md.jpg" alt="" /> </picture></div><div class="swiper-slide"> <picture> <source media="(max-width: 768px)" srcset="https://tomrobison.com/wp-content/uploads/jobs-md-768x768.jpg" /> <source media="(min-width: 769px) and (max-width: 1000px)" srcset="https://tomrobison.com/wp-content/uploads/jobs-md-1000x1000.jpg" /> <source media="(min-width: 1001px) and (max-width: 1536px)" srcset="https://tomrobison.com/wp-content/uploads/jobs-md.jpg" /> <img src="https://tomrobison.com/wp-content/uploads/jobs-md.jpg" alt="" /> </picture></div><div class="swiper-slide"> <picture> <source media="(max-width: 768px)" srcset="https://tomrobison.com/wp-content/uploads/recipes-md-768x768.jpg" /> <source media="(min-width: 769px) and (max-width: 1000px)" srcset="https://tomrobison.com/wp-content/uploads/recipes-md-1000x1000.jpg" /> <source media="(min-width: 1001px) and (max-width: 1536px)" srcset="https://tomrobison.com/wp-content/uploads/recipes-md.jpg" /> <img src="https://tomrobison.com/wp-content/uploads/recipes-md.jpg" alt="" /> </picture></div></div> </div>

<div class="swiper-container swiper-container-h"> <div class="swiper-wrapper"><div class="swiper-slide"> <picture> <source media="(max-width: 610px)" srcset="https://tomrobison.com/wp-content/uploads/home-sm-1-610x738.jpg" /> <source media="(min-width: 611px) and (max-width: 768px)" srcset="https://tomrobison.com/wp-content/uploads/home-sm-1-768x929.jpg" /> <img src="https://tomrobison.com/wp-content/uploads/home-sm-1.jpg" alt="" /> </picture></div><div class="swiper-slide"> <picture> <source media="(max-width: 610px)" srcset="https://tomrobison.com/wp-content/uploads/jobs-sm-1-610x738.jpg" /> <source media="(min-width: 611px) and (max-width: 768px)" srcset="https://tomrobison.com/wp-content/uploads/jobs-sm-1-768x929.jpg" /> <img src="https://tomrobison.com/wp-content/uploads/jobs-sm-1.jpg" alt="" /> </picture></div><div class="swiper-slide"> <picture> <source media="(max-width: 610px)" srcset="https://tomrobison.com/wp-content/uploads/our-story-sm-610x738.jpg" /> <source media="(min-width: 611px) and (max-width: 768px)" srcset="https://tomrobison.com/wp-content/uploads/our-story-sm-768x929.jpg" /> <img src="https://tomrobison.com/wp-content/uploads/our-story-sm.jpg" alt="" /> </picture></div><div class="swiper-slide"> <picture> <source media="(max-width: 610px)" srcset="https://tomrobison.com/wp-content/uploads/home-sm-1-1-610x738.jpg" /> <source media="(min-width: 611px) and (max-width: 768px)" srcset="https://tomrobison.com/wp-content/uploads/home-sm-1-1-768x929.jpg" /> <img src="https://tomrobison.com/wp-content/uploads/home-sm-1-1.jpg" alt="" /> </picture></div><div class="swiper-slide"> <picture> <source media="(max-width: 610px)" srcset="https://tomrobison.com/wp-content/uploads/quality-sm-610x738.jpg" /> <source media="(min-width: 611px) and (max-width: 768px)" srcset="https://tomrobison.com/wp-content/uploads/quality-sm-768x929.jpg" /> <img src="https://tomrobison.com/wp-content/uploads/quality-sm.jpg" alt="" /> </picture></div><div class="swiper-slide"> <picture> <source media="(max-width: 610px)" srcset="https://tomrobison.com/wp-content/uploads/recipes-sm-610x738.jpg" /> <source media="(min-width: 611px) and (max-width: 768px)" srcset="https://tomrobison.com/wp-content/uploads/recipes-sm-768x929.jpg" /> <img src="https://tomrobison.com/wp-content/uploads/recipes-sm.jpg" alt="" /> </picture></div><div class="swiper-slide"> <picture> <source media="(max-width: 610px)" srcset="https://tomrobison.com/wp-content/uploads/jobs-sm-610x738.jpg" /> <source media="(min-width: 611px) and (max-width: 768px)" srcset="https://tomrobison.com/wp-content/uploads/jobs-sm-768x929.jpg" /> <img src="https://tomrobison.com/wp-content/uploads/jobs-sm.jpg" alt="" /> </picture></div></div> </div>

<div class="swiper-container swiper-container-h"> <div class="swiper-wrapper"><div class="swiper-slide"> <picture> <source media="(max-width: 768px)" srcset="https://tomrobison.com/wp-content/uploads/home-lg-2-768x433.jpg"> <source media="(min-width: 769px) and (max-width: 1000px)" srcset="https://tomrobison.com/wp-content/uploads/home-lg-2-1000x563.jpg"> <source media="(min-width: 1001px) and (max-width: 1536px)" srcset="https://tomrobison.com/wp-content/uploads/home-lg-2-1536x865.jpg"> <source media="(min-width: 1537px)" srcset="https://tomrobison.com/wp-content/uploads/home-lg-2.jpg"> <img src="https://tomrobison.com/wp-content/uploads/home-lg-2.jpg" alt=""> </picture></div><div class="swiper-slide"> <picture> <source media="(max-width: 768px)" srcset="https://tomrobison.com/wp-content/uploads/our-story-lg-768x433.jpg"> <source media="(min-width: 769px) and (max-width: 1000px)" srcset="https://tomrobison.com/wp-content/uploads/our-story-lg-1000x563.jpg"> <source media="(min-width: 1001px) and (max-width: 1536px)" srcset="https://tomrobison.com/wp-content/uploads/our-story-lg-1536x865.jpg"> <source media="(min-width: 1537px)" srcset="https://tomrobison.com/wp-content/uploads/our-story-lg.jpg"> <img src="https://tomrobison.com/wp-content/uploads/our-story-lg.jpg" alt=""> </picture></div><div class="swiper-slide"> <picture> <source media="(max-width: 768px)" srcset="https://tomrobison.com/wp-content/uploads/recipes-lg-768x433.jpg"> <source media="(min-width: 769px) and (max-width: 1000px)" srcset="https://tomrobison.com/wp-content/uploads/recipes-lg-1000x563.jpg"> <source media="(min-width: 1001px) and (max-width: 1536px)" srcset="https://tomrobison.com/wp-content/uploads/recipes-lg-1536x865.jpg"> <source media="(min-width: 1537px)" srcset="https://tomrobison.com/wp-content/uploads/recipes-lg.jpg"> <img src="https://tomrobison.com/wp-content/uploads/recipes-lg.jpg" alt=""> </picture></div><div class="swiper-slide"> <picture> <source media="(max-width: 768px)" srcset="https://tomrobison.com/wp-content/uploads/jobs-lg-768x433.jpg"> <source media="(min-width: 769px) and (max-width: 1000px)" srcset="https://tomrobison.com/wp-content/uploads/jobs-lg-1000x563.jpg"> <source media="(min-width: 1001px) and (max-width: 1536px)" srcset="https://tomrobison.com/wp-content/uploads/jobs-lg-1536x865.jpg"> <source media="(min-width: 1537px)" srcset="https://tomrobison.com/wp-content/uploads/jobs-lg.jpg"> <img src="https://tomrobison.com/wp-content/uploads/jobs-lg.jpg" alt=""> </picture></div><div class="swiper-slide"> <picture> <source media="(max-width: 768px)" srcset="https://tomrobison.com/wp-content/uploads/quality-lg-768x433.jpg"> <source media="(min-width: 769px) and (max-width: 1000px)" srcset="https://tomrobison.com/wp-content/uploads/quality-lg-1000x563.jpg"> <source media="(min-width: 1001px) and (max-width: 1536px)" srcset="https://tomrobison.com/wp-content/uploads/quality-lg-1536x865.jpg"> <source media="(min-width: 1537px)" srcset="https://tomrobison.com/wp-content/uploads/quality-lg.jpg"> <img src="https://tomrobison.com/wp-content/uploads/quality-lg.jpg" alt=""> </picture></div></div> </div>

<div class="swiper-container swiper-container-h"> <div class="swiper-wrapper"><div class="swiper-slide"> <picture> <source media="(max-width: 768px)" srcset="https://tomrobison.com/wp-content/uploads/home-lg-2-768x433.jpg"> <source media="(min-width: 769px) and (max-width: 1000px)" srcset="https://tomrobison.com/wp-content/uploads/home-lg-2-1000x563.jpg"> <source media="(min-width: 1001px) and (max-width: 1536px)" srcset="https://tomrobison.com/wp-content/uploads/home-lg-2-1536x865.jpg"> <source media="(min-width: 1537px)" srcset="https://tomrobison.com/wp-content/uploads/home-lg-2.jpg"> <img src="https://tomrobison.com/wp-content/uploads/home-lg-2.jpg" alt=""> </picture></div><div class="swiper-slide"> <picture> <source media="(max-width: 768px)" srcset="https://tomrobison.com/wp-content/uploads/our-story-lg-768x433.jpg"> <source media="(min-width: 769px) and (max-width: 1000px)" srcset="https://tomrobison.com/wp-content/uploads/our-story-lg-1000x563.jpg"> <source media="(min-width: 1001px) and (max-width: 1536px)" srcset="https://tomrobison.com/wp-content/uploads/our-story-lg-1536x865.jpg"> <source media="(min-width: 1537px)" srcset="https://tomrobison.com/wp-content/uploads/our-story-lg.jpg"> <img src="https://tomrobison.com/wp-content/uploads/our-story-lg.jpg" alt=""> </picture></div><div class="swiper-slide"> <picture> <source media="(max-width: 768px)" srcset="https://tomrobison.com/wp-content/uploads/recipes-lg-768x433.jpg"> <source media="(min-width: 769px) and (max-width: 1000px)" srcset="https://tomrobison.com/wp-content/uploads/recipes-lg-1000x563.jpg"> <source media="(min-width: 1001px) and (max-width: 1536px)" srcset="https://tomrobison.com/wp-content/uploads/recipes-lg-1536x865.jpg"> <source media="(min-width: 1537px)" srcset="https://tomrobison.com/wp-content/uploads/recipes-lg.jpg"> <img src="https://tomrobison.com/wp-content/uploads/recipes-lg.jpg" alt=""> </picture></div><div class="swiper-slide"> <picture> <source media="(max-width: 768px)" srcset="https://tomrobison.com/wp-content/uploads/jobs-lg-768x433.jpg"> <source media="(min-width: 769px) and (max-width: 1000px)" srcset="https://tomrobison.com/wp-content/uploads/jobs-lg-1000x563.jpg"> <source media="(min-width: 1001px) and (max-width: 1536px)" srcset="https://tomrobison.com/wp-content/uploads/jobs-lg-1536x865.jpg"> <source media="(min-width: 1537px)" srcset="https://tomrobison.com/wp-content/uploads/jobs-lg.jpg"> <img src="https://tomrobison.com/wp-content/uploads/jobs-lg.jpg" alt=""> </picture></div><div class="swiper-slide"> <picture> <source media="(max-width: 768px)" srcset="https://tomrobison.com/wp-content/uploads/quality-lg-768x433.jpg"> <source media="(min-width: 769px) and (max-width: 1000px)" srcset="https://tomrobison.com/wp-content/uploads/quality-lg-1000x563.jpg"> <source media="(min-width: 1001px) and (max-width: 1536px)" srcset="https://tomrobison.com/wp-content/uploads/quality-lg-1536x865.jpg"> <source media="(min-width: 1537px)" srcset="https://tomrobison.com/wp-content/uploads/quality-lg.jpg"> <img src="https://tomrobison.com/wp-content/uploads/quality-lg.jpg" alt=""> </picture></div></div> </div>

Autoplay

Good Earth Natural Foods

Visit genatural.com

E-commerce Website

Good Earth Natural Foods

E-commerce Website

Image controller:

Auto-advance images:

Visit genatural.com

Personal contribution

Front + back-end development, responsive for all devices.

Project features

Wordpress custom theme.
Integration with Freshop e-commerce API.
Custom, branded Wordpress backend environment for multiple content-management roles.
HTML5/CSS3/Javascript.

Project description

The Good Earth Natural Foods website integrates WordPress with Freshop, their e-commerce and stock management API. Because they manage an inventory of over ten thousand SKUs through Freshop, and because Freshop is closed-source, we were limited in how we were able to interact with the data. Because of this, I needed to employ many unique solutions. The website was able to merge their new design, with the functionality of their existing e-commerce API.