Postertok

Custom Shopify Landing Pages

postertok.com

The story

PosterTok is a large US based DTC brand which is known and loved by their younger demographic of customers because of the high quality posters they sell at a extremely affordable price point. Customers can go as far as uploading their own photo onto the website to be printed out as a poster itself. After having their website for a while they were looking for a refresh on certain pages they wanted to push more traffic to and already popular product pages.

Software used
  • Shopify Liquid
  • Alternate page templates
  • Mega menu
  • Loox Reviews
Goals
  • Build out the designs in 9 days
  • Ensure a smooth transition when going live
  • Create a great mobile experience
  • Allow for easy customization
  • Increase AOV
  • Increase conversion rates
Project overview

We were tasked with building out the approved designs inside of Shopify itself. The challenge we took upon ourselves is to develop the custom sections in a way that makes them easily customisable and re-usable instead of hard-coding them in. We had to use their own product sections and include them in the new page layouts to ensure everything was working and also use the Loox review app.

Before
Before
Before
After
After
After
What we did

We used Shopify 'Schemas' and a range of the Shopify Liquid Input settings when creating the custom section used for the build. We made sure to use good code practices and ensure the mobile experience was top notch because of how much traffic mobile devices represent in 2022. We made use of section blocks which also allowed the client to add/remove bits of text with ease.

We also used a little JavaScript/jQuery inside of the build in areas like the FAQs and other sections to give users a more visually appealing experience when browsing through the products. We also created custom forms with an Add To Cart submit button allowing customers to select the variant they want and add to cart without every seeing the product page.

CSS grid was used very frequently during the development of these custom sections for the landing page. We showed off our skills of using the CSS grid and making it work seamlessly with Shopify Liquid 'For loops', liquid objects, actual CSS styles and liquid filters and a range of other iteration types. Also being able to switch the order of the grid and then use input setting to allow the client to edit as they see fit.

Once all of the sections, alternate templates, snippets and modifications were made, we were ready to go live. We were able to find the menu system and replace the old pages with the new landing pages and also switch the product template for the 'Upload your own' product.

The results

The project was completed on time and followed the design requested almost perfectly. Customizability was a big success with this project.

The end client is now able to choose different styles of buttons, text and background colors, edits almost all the text, change icons, flip the side of sections, use gradient text, apply different fonts on certain pages, re-use sections, change text colors mid-sentence, remove and add blocks at will, change the numbers of rows/columns, swap out images, change URLs of buttons, selected collections and individual products for certain sections too.

The results
Google ReviewsGoogle ReviewsGoogle ReviewsGoogle ReviewsGoogle Reviews

Victor is a pleasure to work with. Having collaborated with him across a series of projects, I can comfortably say that Victor is a dependable web developer for any business to work with. Victor has strong communication skills, and never fails to put in the extra hours to make a project truly world-class.

Matthew Attalah | PosterTok Collaborator
Looking to build a Shopify store?
From a customized full website build to custom landing pages to conversion rate optimisation to fully customized Shopify/Plus builds - we've got you covered. Get in touch today!
victor@chudigital.com
Check out our other work!
© CHU DIGITAL LIMITED | Company Number: 14352740