Questions about changing Position of Store Name and Slide Show Text

TriS68
New Member
10 0 0

Hi! I have a few questions about my site.

1) How do I make my store name appear on one line and in a different case, ie. The HBCU Equation?

2) Can I change the individual font character colors of my store name so that the letters HBCU each have a different color font?

3) How do I move the slide show font so that it a) appears aligned on the right and on more than one line, ie

The Equation

That Equals

Success

and b) appears lower when it's in the center of the image?

Thank you!!!

https://phsdhqvkmeau23p6-51727794347.shopifypreview.com

Replies 9 (9)

pioneer100
Shopify Partner
1119 145 481

Please place this code at the end of theme.scss

.site-header__logo-link {
text-transform: none;
}

/* place any color you want in place of color name */
.site-header__logo-link::nth-letter(4)  {
color: red; 
}
.site-header__logo-link::nth-letter(5)  {
color: green; 
}
.site-header__logo-link::nth-letter(6)  {
color: grey; 
}
.site-header__logo-link::nth-letter(7)  {
color: beige; 
}

/* letter formatting end */

.slideshow__text-content .page-width {
margin: 0 right !important;
}
If helpful, Please Like and accept The Solution.
TriS68
New Member
10 0 0

Thank you candiSoft, but I think I need a little more instruction. I've tried placing the code at the end both before and after the final </body>
</html> (see below) but nothing changes. Your further assistance is appreciated.

<ul hidden>
<li id="a11y-refresh-page-message">{{ 'general.accessibility.refresh_page' | t }}</li>
<li id="a11y-selection-message">{{ 'general.accessibility.selection_help' | t }}</li>
</ul>
</body>
</html>
.site-header__logo-link {
text-transform: none;
}
.site-header__logo-link::nth-letter(4) {
color: red;
}
.site-header__logo-link::nth-letter(5) {
color: black;
}
.site-header__logo-link::nth-letter(6) {
color: green;
}
.site-header__logo-link::nth-letter(7) {
color: yellow;
}
.slideshow__text-content .page-width {
margin: 0 right !important;
}

pioneer100
Shopify Partner
1119 145 481

No, Do not put there
Please place code at the end of Online Store -> Themes -> Edit code -> Assets -> theme.scss.liquid file and then try

If helpful, Please Like and accept The Solution.
TriS68
New Member
10 0 0

I tried adding it before, after & between </body> </html> nothing changed on my site.  I'm probably still doing something wrong. Thanks for your patience.

 

Screen Shot 2020-12-13 at 11.12.55 AM.png

pioneer100
Shopify Partner
1119 145 481

There will be assets folder. And in that folder, there will be theme.scss.liquid file. Please place this code at the end of theme.scss.liquid file

If helpful, Please Like and accept The Solution.
TriS68
New Member
10 0 0

I changed my heading so I no longer need that part of the code, but I still would like to put the heading in a different place on the slide.

Please look at the screenshots below. I've tried adding it where I think you mean, but nothing happens.  One is in theme.liquid and one is in theme.css 

Screen Shot 2020-12-18 at 4.40.42 PM.pngScreen Shot 2020-12-18 at 4.42.41 PM.png

 

pioneer100
Shopify Partner
1119 145 481

In theme.liquidm there will be <head> tag before <body> tag. Please place code before </head> tag

If helpful, Please Like and accept The Solution.
TriS68
New Member
10 0 0

Thank you for your continued assistance. I'd tried it. See screenshot below. Still no change. 

Screen Shot 2020-12-18 at 11.05.14 PM.png

pioneer100
Shopify Partner
1119 145 481

<style>

PLEASE PLACE CODE HERE...

</style>


Position is right. please add <style> tag before and after

If helpful, Please Like and accept The Solution.