Ciodensky Posted October 30, 2021 Share Posted October 30, 2021 Site URL: https://www.xystema.com/ Hi! I am trying to break a line text into 2 and I want the first line font-size bigger than the 2nd line. Attached the screenshots of what I am having now and what I want to happen. Website details: www.xystema.com password: 061298 I will appreciate any help. Thanks so much. Link to comment
tuanphan Posted November 1, 2021 Share Posted November 1, 2021 Hi, Where is page in screenshot? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Ciodensky Posted November 1, 2021 Author Share Posted November 1, 2021 15 hours ago, tuanphan said: Hi, Where is page in screenshot? It is right there. But I am sending it again here below. Please let me know if you are not seeing it again. Link to comment
tuanphan Posted November 2, 2021 Share Posted November 2, 2021 Hi, I meant can you share link to page where you have problem? I don't see it on homepage Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Ciodensky Posted November 2, 2021 Author Share Posted November 2, 2021 5 minutes ago, tuanphan said: Hi, I meant can you share link to page where you have problem? I don't see it on homepage Hi Tuan, sorry, here's the link: https://www.xystema.com/pricing by the way, I am using the Shinypass for the automatic currency conversion there, fyi. Link to comment
tuanphan Posted November 4, 2021 Share Posted November 4, 2021 On 11/2/2021 at 7:31 AM, Ciodensky said: Hi Tuan, sorry, here's the link: https://www.xystema.com/pricing by the way, I am using the Shinypass for the automatic currency conversion there, fyi. Try adding to Design > Custom CSS span.convertedPrice { display: block !important; } Ciodensky 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Ciodensky Posted November 4, 2021 Author Share Posted November 4, 2021 11 hours ago, tuanphan said: Try adding to Design > Custom CSS span.convertedPrice { display: block !important; } Hi Tuan, With your suggested code, I am able to separate the $199.00 to the 1st line. But since you separated the span.convertedPrice to a block, the "every month" separated as well to 3rd line. And I cannot be able to increase the font-size of the 1st line because the convertedPrice comes from the Shinypass (automated currency converter). What I am trying to achieve now, since I could do the replace script code, as follows, I want to change the style upon replaced but looks like something is missing with my script (paste on the settings > advanced > code injection > header). <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script> <script> $(document).ready(function() { $(".product-price").html(function() { return $(this).html().replace("$199.00", "<span style="font-size: 40px;font-weight:Bold;">$199</span>"); }); }); </script Can you help me figure out what's wrong with my script? Why the style is not working. Link to comment
Solution Ciodensky Posted November 5, 2021 Author Solution Share Posted November 5, 2021 13 hours ago, Ciodensky said: Hi Tuan, With your suggested code, I am able to separate the $199.00 to the 1st line. But since you separated the span.convertedPrice to a block, the "every month" separated as well to 3rd line. And I cannot be able to increase the font-size of the 1st line because the convertedPrice comes from the Shinypass (automated currency converter). What I am trying to achieve now, since I could do the replace script code, as follows, I want to change the style upon replaced but looks like something is missing with my script (paste on the settings > advanced > code injection > header). <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script> <script> $(document).ready(function() { $(".product-price").html(function() { return $(this).html().replace("$199.00", "<span style="font-size: 40px;font-weight:Bold;">$199</span>"); }); }); </script Can you help me figure out what's wrong with my script? Why the style is not working. @creedon has helped me with this already. I need to scape the " with \" and so it was solved. Pertaining to the question here, it was solved also with the same code above but with <br> insert right after the $199. So here's the correct code now: <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script> <script> $(document).ready(function() { $(".product-price").html(function() { return $(this).html().replace("$199.00", "<span style=\"font-size: 40px;font-weight:Bold;\">$199<br></span>"); }); }); </script Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment