Debut Theme Help - Image with Text Overlay\Header Menu buttons

New Member
5 0 0

Hello,

 

I'm trying to do 2 things with my store:

1. Make the whole Image with Text Overlay clickable to my products.

2. Make the top menu buttons become bold when I hover over them and stay bold when I click on them (instead of underline).

 

Thank you very much for anyone willing to help :)Capture.JPG

 

0 Likes

Hello ,
Please share yourn site url.
So that i can check and provide you exact solution here.

Want to modify or incorporate custom changes on store, Hire us.
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Custom Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Digital Marketing | Site Speed Optimization | Web Development
0 Likes

Please share a store url to better assist

Thanks & Regards
Perennial Solution

Would like to add new functionality or customize an existing one, please hire us.
If helpful then please Like and Accept Solution .
Email: infoperennialsolution@gmail.com
Skype: infoperennialsolution
0 Likes
Highlighted
New Member
1 0 0

The Flex theme includes a highly versatile Image with Text Overlay section that is perfect to show off stunning banner images. While this section is most often seen at the top of a homepage, it can be used throughout the homepage to display eye-catching images. In the 'Image with Text Overlay' section, you can add text and buttons on top of the images as well - so it's important to avoid using any images that can be distracting! You can adjust the horizontal and vertical position and text alignment as well, so it can be helpful choosing an image that has some negative space in it so you can position the text accordingly. Custom CSS and mobile-specific layout options can be included in this section as well for further configuration, and you can upload a mobile-specific image as well. 

In order to set up the Image with Text Overlay section, click into Customize (your Theme Editor) > Sections > Add Section > Image with Text Overlay.

 

Image with Text Overlay Settings

The 'Image with Text Overlay' section settings determines the look and layout of this section! The settings are divided into the following areas: image, text, text background, buttons, mobile, layout, and advanced.

0 Likes
New Member
5 0 0

Hi,

 

Thank you for you help.

This is my link: https://6n6u73xvdwijqnlt-27425931298.shopifypreview.com

 

Just to clarify: I would like the Image with Text Overlay to be clickable and appoint to "My Products"

 

0 Likes
New Member
5 0 0

Hi,

 

Thank you for you help.

This is my link: https://6n6u73xvdwijqnlt-27425931298.shopifypreview.com

 

Just to clarify: I would like the Image with Text Overlay to be clickable and appoint to "My Products"


@Perennial wrote:

Please share a store url to better assist


 

0 Likes

Hello,

1. Make the whole Image with Text Overlay clickable to my products:-For this You have to customize your code.For link you need to add Schema

 

2.To Make the top menu buttons become bold when  hover over them and stay bold when  click on them (instead of underline) :

1. Go to Online Store->Theme->Edit code
2. Asset->theme.scss->paste bellow code in bottom of file

#SiteNav .site-nav__link:hover {
	font-weight: 700;
}
#SiteNav .site-nav__label {
	border-bottom: none;
}

 

 

Want to modify or incorporate custom changes on store, Hire us.
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Custom Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Digital Marketing | Site Speed Optimization | Web Development
1 Like
New Member
5 0 0

Hi, thank you for the help with the top menu buttons, worked perfectly.

About the image, I didn't understand what you mean. 

Can you help me with the code to make the image clickable? Or maybe direct me to where I can add <a href>?


@oscprofessional wrote:

Hello,

1. Make the whole Image with Text Overlay clickable to my products:-For this You have to customize your code.For link you need to add Schema

 

2.To Make the top menu buttons become bold when  hover over them and stay bold when  click on them (instead of underline) :

1. Go to Online Store->Theme->Edit code
2. Asset->theme.scss->paste bellow code in bottom of file

#SiteNav .site-nav__link:hover {
	font-weight: 700;
}
#SiteNav .site-nav__label {
	border-bottom: none;
}

 

 


 

0 Likes