[Tomáš]

Hello, (new.gpf1.cz)
within ‘Font Size Options’ I can find ‘Headings Line Height’ only (not Size, despite included in Theme Instructions).There are no Font Size options within ‘Featured Slider’ option either.

My goal is
(1) to change Headings Font Size
(2) to give it some background so the Text is distinguishable from the image itself (e.g. like on http://www.gpf1.cz main page) – because, no matter what color I chose, Headings text is not sharp enough to be easily readable and eye-catching.

Thanks for advise
Tom

[Sakin]

@Tomáš: Heading line height is correspond to heading font size like h1, h2, h3, h4. But featured slider used different. You have change the slider title and content font size as per your need and add the following css in “Appearance => Theme Options => Custom CSS” box:

@media screen and (min-width: 961px) {
    #main-slider .entry-header .entry-title { font-size: 24px; }
    #main-slider .entry-content { font-size: 16px; }
}

[Tomáš]

Dear Sakin,
thanks very much for your fast and useful help. Works perfectly.

One additional issue, though: is there a possibility, within the Custom CSS, to apply transparent rectangle area as text background, in order to make the text better visible?

Thanks very much. Appreciated.
Tom

[Tomáš]

Having said that, I’ve figured out the {background-color: something; } parameter, but still working on transparency options 🙂

[Sakin]

@Tomáš: sure no problem.

[Sakin]

@Tomáš: For transparency, you need to use rgba color.

[Tomáš]

Another partial success 😉 I discovered {opacity:0.x} command, but that obviously applies for both text AND background. Any idea how to apply it for background only? 🙂

[Tomáš]

Dear Sakin, can you give me more details on your advise regarding RGBA color, please?

[Tomáš]

I think I understand what you mean: background: {rgba(54, 25, 25, .5)}

Correct? It seems working. Big thanks for the support. Total PRO 🙂

[Tomáš]

I got lucky with your theme. I love it. It’s beautifully empathetic and have functions I desired for so long. Made me happy 🙂

[Sakin]

@Tomáš: Yes, for example you can see the following CSS:
#header-top { background: rgba(255, 255, 255, 0.7); }

Thanks for your appreciation my support and theme. I hope you will support me as well. Please support by providing your valuable review and rating at https://wordpress.org/support/view/theme-reviews/catch-flames?rate=5#postform

Thanks in advance 🙂

[Tomáš]

Sakin, will do for sure!

One more question though… can I somehow move the slider text somewhere else? E.g. right bottom corner?

[Sakin]

@Tomáš: You can add the following css:

#main-slider .entry-container {
    bottom: 0;
    left: auto;
    right: 0;
}

[Tomáš]

Sakin,
now, I am definitely going to write that review. The only issue I have is 5 stars is not enough 😉

But before I will do that, please, (I really hope it’s last one from me), can you give me a hint how to work with the grey transparent background rectangle? (e.g. to make it less wide). Then… I will become silent! 😉 http://new.gpf1.cz

Current CSS code I use is following:

@media screen and (min-width: 961px) {
#main-slider .entry-header .entry-title { font-size: 35px; background: rgba(64, 64, 64, .8); }
#main-slider .entry-content { font-size: 20px; background: rgba(64, 64, 64, .8); }
}

#main-slider .entry-container {
bottom: 0;
left: 150px;
right: auto;
text-align: left;
}

[Sakin]

Ok for that you can replace your css:

@media screen and (min-width: 961px) {
    #main-slider .entry-header .entry-title { font-size: 35px; background: rgba(64, 64, 64, .8); }
    #main-slider .entry-content { font-size: 20px; background: rgba(64, 64, 64, .8); }
}

with the following css, where I have added in the width. Just change the width as per your need.

@media screen and (min-width: 961px) {
    #main-slider .entry-container { width: 50%; }
    #main-slider .entry-header .entry-title { font-size: 35px; background: rgba(64, 64, 64, .8); }
    #main-slider .entry-content { font-size: 20px; background: rgba(64, 64, 64, .8); }
}

[Tomáš]

Thank you. I am very satisfied now 🙂 I also provided 5 star review for your Theme 🙂

[Sakin]

@Tomáš: Thanks a lot 🙂

[Tomáš]

Dear Sakin,
wonder why Header Post title is not visible on mobile version of new.gpf1.cz web? Only Post’s short description is. Thank you!
Tomas

[catchinternet]

@Tomáš: Try adding in the following css in “Appearance => Theme Options => Custom CSS” box:

@media screen and (max-width: 782px) {
    #main-slider .entry-container { left: 2%; width: 96%; }
    #main-slider .entry-header .entry-title { font-size: 16px; }
    #main-slider .entry-content { font-size: 14px; }
}

[Tomáš]

Hello Sakin,
cat and mouse game I suppose 😉 Thanks for advise. It helped for mobile device.

But now I have lost the text background we discussed earlier within this topic. Transparent background using RGBA code. Thanks for help.

[Author]

Posts