Hello,
How can I place the title of the collection cards on the images instead under it?
1 Like
Hi @StudioBlank ,
Step 1: Go to Shopify Admin → Online Store ->Theme → Edit code
Step 2: Search file theme.liquid
Step 3: Insert this code above tag:
Here is result:
Hope this can help you,
If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 
1 Like
- Here is the solution for you @StudioBlank
- Please follow these steps:
- Then find the base.css or theme.css file.
- Then add the following code at the end of the file and press ‘Save’ to save it.
.card__inner+.card__content {
position: absolute !important;
bottom: -4px !important;
}
- Here is the result you will achieve:
- Please press ‘Like’ and mark it as ‘Solution’ if you find it helpful. Thank you.
1 Like
Hi @StudioBlank ,
I have reviewed your requirement, you just need to edit css script and the issue will be resolved. You can follow my instructions!
Step 1: Go to Admin → Online store → Theme > Edit code:
Step 2: Search for the file base.css. And add this code snippet to the end of the file.
.card__inner+.card__content {
position: absolute !important;
bottom: -14px !important;
}
Step 3: Save and reload home page.
=>> The result:
Some text colors are blending with the image background, making them hard to display. I think you should consider changing the text color or adding a background color to make the display clearer.
I hope these instructions will help you. If they are helpful, please give us likes and mark as the solution.
Have a nice day sir!
1 Like
Hi @StudioBlank for any given CSS band-aid solutions below try to use a custom-css setting first before modifying files code directly.
This can avoid inadvertently breaking a theme or complicating future version. upgrades
https://help.shopify.com/en/manual/online-store/themes/theme-structure/extend/add-css
The custom-css setting does not need the surrounding opening and closing style tags: …
If you must modify files directly always make a back up duplicate of the theme first.
And learn how to rollback eligible files
1 Like
This also works but, this changes every card on the site, even the product cards.
I just need to change the collection cards. Thanks
It works but i just want to change the collection cards only
Hi @StudioBlank ,
Step 1: Go to Shopify Admin → Online Store ->Theme → Edit code
Step 2: Search file theme.liquid
Step 3: Insert this code above tag:
{% if template.name == 'collection' %}
{% endif %}
Here is result:
Hope this can help you,
If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you
HI @StudioBlank ,
We’re happy to see that our suggestion helped you solve the issue.
If you want to change the collection cards only, you need to add condition of this code css.
Follow my guides:
Step 1: Go to Admin → Online store → Theme > Edit code:
Step 2: Search for the file theme.liquid. And add this code snippet before tag or :
{% if template.name contains 'collections' %}
{% endif %}
Step 3: Save and reload home page.
I hope these instructions will help you. If they are helpful, please give us likes and mark as the solution.
Have a nice day sir!
1 Like
Nope, same issue and now the whole image is unclickable