-
Posts
-
Hi! I have two headers that I want to be responsive, but each are a different size. When I try to apply responsive text to one, it applies it to both. Could you help?
Hi there,
Thanks for writing in! It would be best if you add some screenshot to point out the issue because it seems fine on my end for all screen size. Maybe I am not looking at the right place. Let’s point that.
Cheers!
Yes.
Image one: the setting for the first custom headline
image two: two different headline elements, both taking on the same size once I put in the responive settings. I want them both to have two different sizes and two different responsive text settings.
Even when I try to add a new responsive text item, it still changes ALL of my headings on the page. I know it must be because I am using the same selector name, but it doesn’t work if I put in another selector name
Hello There,
Thanks for the updates! if you want to have a the same font size, you’ll need to use the same selector. Please also make sure that the minimum font size if big enough. 10 is not a good one. You can try 18 or 20 and please keep in mind that the font size will be calculated related to the width of the element. This is why you won’t have the same font size result especially if your headlines will have different text length. The shorter text tends to be has the larger font-size than the longer text. This is why you must set a bare minimum font size that would make them equally the same.
Hope this explains it briefly.
One header a different size than the other. Both responsive. When I make my headers responsive they suddenly change to all the same size.
Hello There,
If you want to have a separate custom headline font size, you have to insert a custom class to each of your custom headlines like resp-headline-1 and resp-headline-2. You can then use these classes to create two separate responsive text. You manage it in Settings > Responsive Text. For more details how you can set responsive text, please check this out: https://community.theme.co/kb/shortcode-walkthrough-responsive-text/
Hope this helps.
Hi! Thank you for the resources. I’ve created two separate custom classes in the settings>responsive text area, but my headers are not responding. Any ideas?
Hi there,
I went ahead and fixed the responsive text settings for both headlines.
It should be working now. Kindly double check.
- <script> jQuery(function($){ $("#no-reply-1185103 .bbp-template-notice, .bbp-no-topic .bbp-template-notice").removeClass('bbp-template-notice'); }); </script>
