Using the SiteOrigin Editor, how do I change the Title from UPPER CASE to Title Case?
Change the Title font case?
This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.
Hi Bhs67,
You’ll need to use CSS for this. If you would like to change a specific title, please open the editor and head over to the widget styles sidebar. Open the Attribute settings group and set the widget class to title-capitalize and then save the page. Please navigate to WP AdminAppearanceCustom CSS and add the following CSS:
.title-capitalize .widget-title { text-transform: capitalize;}You might also need to install the SiteOrigin CSS Editor.
If you would like to capitalize all titles, please navigate to WP AdminAppearanceCustom CSS and add the following CSS:
.so-widget-sow-editor .widget-title { text-transform: capitalize;}You might also need to install the SiteOrigin CSS Editor.
I installed the SiteOrigin CSS plugin (Syndney theme). I added:
.title-capitalize .widget-title {
text-transform: capitalize;
}
No change. All titles remain UPPER CASE.
Hi Bhs67,
Do you have a public URL where we can take a look at what’s going on?
I'm on a steep learning curve for WordPress … have not posted anything yet. However, http://toastmasters.foxping.com/ is the first site I plan to convert to WordPress.
Hi Bhs67,
Would it be possible for you to link me to the WordPress install your working with? Or is it a locally hosted website?
https://nd.lp.foxping.com/
Theme: Sydney
Plugins: Visual Editor, SiteOrigin Google Map.
Hi Bhs67,
Ah. You’re using the Black Studio TinyMCE Widget instead of the SiteOrigin Editor widget which is why my previous CSS (at least the second CSS, the first works) didn’t work. Please add the following CSS to WP AdminAppearanceCustom CSS:
.widget_black-studio-tinymce .widget-title { text-transform: capitalize; }It works! Thanks!
It would be good if there were an option to change the font size for the text. Here is what I'm using, via the Text mode:
—————-
<h6><p style="text-align: center;"><span style="color: #000000;">Learn more:</span> <span style="color: #0000ff;"><a style="color: #0000ff;"
href="https://www.lp.org/the-libertarian-party/">https://www.lp.org/the-libertarian-party/</a></span></p></h6>
—————-
This works, but it would be easier with this option in the Visual mode.