Notice: This thread is over two years old; the information may be outdated. Please consider creating a new thread if you require free support. If you have an active SiteOrigin Premium license, you can email our premium support desk at [email protected].
Using the SiteOrigin Editor, how do I change the Title from UPPER CASE to Title Case?
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.