Started this page just to have a visual reference for myself and decided to share it in case it benefits anyone else. This deals with the Title Bar adjustments in the WordPress Imagely 2.o Theme. You can also find info at the documentation section on their website and typing “Page Title” in the search box. 

Changing the Default Background Image of the Title Bar~

Imagely 2.3 Title Bar Settings

1) I thought the term “Background Image” referred to the background image of the whole site instead of a colour. It doesn’t, it refers to the background image of the Title Bar only. So, if you want to get rid of that big default image that came with the Theme it is actually under Customize>Body>Single Page Layout>Page Title>Style>Background. Hence the name: Page Title.

2) You can delete the default image and replace it with your own, or just drop it entirely. Not to be confused with the Header.

Imagely 2.0 Title Bar Settings

3) You can also change the size via the Height option as seen below. This is how they get that big splash image on the front.

Imagely 2.3 Title Bar Settings.

4) Notice you can also change the Size option (Default, Cover, etc.) and the Opacity of the Overlay. Therefore, if a person liked a background image in the Title Bar you could aim for the right mix/ration of Title Bar to Header or whatever. 


Making Global Changes using the Customize Option~

1)  Default setting. Title Bar, Page Title and Breadcrumbs on right hand size are visible.
Customize>Body>Single Page Layout>Page Title
Note: Breadcrumbs do not show up on the Home Page, just your other pages.

Imagely 2.3 Title Bar Settings.

2) Hiding the Page Title but keep the Breadcrumbs on the right hand side.
Customize>Body>Single Page Layout>Page Title Font>Font Size=0

Imagely 2.3 Title Bar Settings.

3) Hiding the Title Bar
Using the Hidden option if you don’t want the Title Bar or Breadcrumbs showing.

Imagely 2.3 Title Bar Settings.


Tweaking the Tablet & Phone Title Bar~

1) Tablet

Imagely 2.3 Title Bar Settings.

Above~ Default Setting on the Tablet using Customize>Body>Single Page Layout>Page Title & Page Title Font
Below~ A few adjustments to create space between the Title and Breadcrumbs on the Tablet layout.

Imagely 2.3 Title Bar Settings.

2) Phone

Imagely 2.3 Title Bar Settings.

Above~ The default setting for a phone creates crazy type on the Title Bar
Below~ Adjusting the Font size seems to work for a long title.

Imagely 2.3 Title Bar Settings.


Making changes on individual Pages~

Screen shots below (which are top and bottom of page combined) show changes.

Screenshot of Title Bar & edits using Imagely 2.0 on WordPress.

Above~ The Default setting at bottom of editing page under Imagely Settings>Title
Below~ The setting to obtain no Title but still a title bar and Breadcrumbs.

Below~ The setting to obtain no Title Bar, Title or Breadcrumbs. 

Leave a Reply