How to add a gift summary to check out page

Solved
Highlighted
Tourist
4 1 1

Hi,

is there a possibility to add a summary/list ( it can be a text or even an image ) with a list of extra's that customer will receive buying a product. For example: The" extra" is a  unique code for an exsess to watch the video. I would like customer to remind that they receive free gift

 

Kind regard Liza

0 Likes
Highlighted
Tourist
15 0 1

I'm unsure specifically what you're after, although using some simple HTML you can insert an image into a specific portion of the page.

<img src="{{ 'image-name.png' | asset_url }}">

 

You would have to upload 'image-name.png' into the assets section, when editing the code.

 

Hope this helps.

Dama Technologies - Shopify Development
- Was my reply helpful? Click Like to let me know!
- Correct Solution? Mark it as an Accepted Solution!
Highlighted
Tourist
4 1 1

Thank you such for your reply!

I want to achieve something like this without adding an app ( as extra's are not listed as products, they are digital and customer receive them via email )

I wat to add this summary as text or image

 

Schermafbeelding 2020-09-30 om 09.51.23.jpg

 

 

 

 

 

 

 

 

0 Likes
Tourist
15 0 1

This can be done via some simple HTML code!

Here's a little codepen I wrote with the relevant code, you would have to slot under the cart section of the cart page: https://codepen.io/jdamatopoulos/pen/qBZGyqL

Unsure of which theme you're using and the cart page, but I'm sure if you paste that just outside the div containing all of the product/cart info, it'll be displayed there, might have to add a float: left, to get the items to float to the left side!

Hope this helps.

Dama Technologies - Shopify Development
- Was my reply helpful? Click Like to let me know!
- Correct Solution? Mark it as an Accepted Solution!
0 Likes
Highlighted
Tourist
4 1 1

Thank you for your input! Did not work, unfortunately I have debut template 

0 Likes
Highlighted
Tourist
15 0 1

In your cart-template.liquid file, you should paste the code above the <div class="cart__footer"> line!

Example:

LizaK1.PNG

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

and then, in themes.scss.liquid, towards the bottom, paste in the relevant styling code.


LizaK2.PNG

And the outcome, on Debut theme shall look like this:

 

LizaK.PNG

If you use the exact code in the image, you will have to upload an 'green-tick.png' image to the Assets folder:

 

LizaK3.PNG

 

(Find a Green tick easily online somewhere, keep in mind to ensure the image has the correct license to be allowed to use for commercial use!)

Really hope this helps, let me know how you go

P.S I tested the above code and grabbed the screenshots from the Debut theme, it should definitely work!

Dama Technologies - Shopify Development
- Was my reply helpful? Click Like to let me know!
- Correct Solution? Mark it as an Accepted Solution!
0 Likes
Highlighted
Tourist
4 1 1

This is an accepted solution.

Thank you so much! I worked!

Highlighted
Tourist
15 0 1

Hi LizaK!

I'm glad the solution works!

If you don't mind, can you mark the solution I posted as the accepted solution?

Appreciate it, thanks heaps.

Dama Technologies - Shopify Development
- Was my reply helpful? Click Like to let me know!
- Correct Solution? Mark it as an Accepted Solution!
0 Likes