Notifications
Clear all
Topic starter
30/04/2021 6:47 am
Hello dear Plak team, I would like to add icons to my product description to make everything clearer. It worked great on my normal product page (see picture), but in the product description tabs, where everything is coded, I have no way of adjusting the placement of the picture regarding
the text, because I am not used to programming! My current code to insert a graphic is:
<img class="lazyload" data-src="https://cdn.shopify.com/s/files/1/0535/1738/5927/files/PicsArt_04-29-11.44.41.jpg?v=1619733212" alt="image alt text here" style="width:50px;height:50px">
Can you tell me how I can adapt the code of the picture or the text so that the text is on the same level as the graphic? Thanks in advance!
30/04/2021 8:12 pm
Hi
Katrine here from Plak theme support,
in order to get an icon centered and aligned with a text, use this code instead :
<div> <img class="lazyload" style="vertical-align:middle;width: 50px; height: 50px;" data-src="IMAGE URL HERE" alt="image alt text here"> <span>text here</span> </div>
So your entire code for your Shipping tab will become :
<p> </p> <p><strong>Shipping </strong></p> <div> <img class="lazyload" style="vertical-align:middle;width: 50px; height: 50px;" data-src="https://cdn.shopify.com/s/files/1/0535/1738/5927/files/PicsArt_04-29-11.44.41.jpg?v=1619733212" alt="image alt text here"> <span>Free Worldwide Shipping.</span> </div> <p> </p> <div> <img class="lazyload" style="vertical-align:middle;width: 50px; height: 50px;" data-src="https://cdn.shopify.com/s/files/1/0535/1738/5927/files/PicsArt_04-27-12.57.57.jpg?v=1619521639" alt="image alt text here"> <span>We check your personalization within 24 + Contact you by email if any changes are necessary. </span> </div> <p> </p> <div> <img class="lazyload" style="vertical-align:middle;width: 50px; height: 50px;" data-src="https://cdn.shopify.com/s/files/1/0535/1738/5927/files/PicsArt_04-27-12.56.25.jpg?v=1619521633" alt="image alt text here"> <span>Please allow 6-8 working days after the confirmation for the creation of your light.</span> </div> <p> </p> <div> <img class="lazyload" style="vertical-align:middle;width: 50px; height: 50px;" data-src="https://cdn.shopify.com/s/files/1/0535/1738/5927/files/PicsArt_04-29-11.45.27.jpg?v=1619733233" alt="image alt text here"> <span>Due to the high demand, supply delays may occur and delivery time may take 15-30 working days..</span> </div> <p> </p> <div> <img class="lazyload" style="vertical-align:middle;width: 50px; height: 50px;" data-src="https://cdn.shopify.com/s/files/1/0535/1738/5927/files/PicsArt_04-27-01.04.52.jpg?v=1619521662" alt="image alt text here"> <span>Please note that we can only produce a certain number at a time. When reached, product is temporarily unavailable!</span> </div>
Let me know if you have any other questions
Kind regards,
Katrine
Topic starter
02/05/2021 6:56 am
Thank you so much Katrine! Looks perfect, you should not have coded the whole tab! But I am very thankful! Have a nice weekend!
With love
Doreen
03/05/2021 8:13 pm
Thank you so much Katrine! Looks perfect, you should not have coded the whole tab! But I am very thankful! Have a nice weekend!
With love
Doreen
We are here to help, anytime Doreen 😍
Welcome to the Shopify Forum Community provided by Plak ThemeLLC, a place where you can discuss about eCommerce and Shopify, solve technical issues, get help with Shopify Design, Apps integration, Marketing, Facebooks ad, Google ads and more.
Before posting, we invite you to read and follow the forum rules | We also support any questions related to Free Shopify themes :Dawn, Express, Minimal, Brooklyn, Narrative, Supply, Debut, Venture, Boundless and Simple