Came here as this post is among the top hits on the search engine when looking for WordPress image alt and title. Being rather surprised that. Two images together on the same line. WordPress will only allow you to have two images on the same line if you arrange one left and one right, as shown. Because the wordpress caption tags are not html or xhtml, they are wordpress’s own code (like BB code). Continue Reading How To Solve WordPress Image Alignment And Text-Wrap Problems.
06/08/2019
The Title Element is an elegant Element that does exactly what it says: adds a Title into your content. You can, of course, select any Header Tag from H1 through to H6, as well as a variety of styling options including Alignment, Separator styling and Color, and newly introduced in Avada 5.7, overrides for Font size, Line Height and Letter Spacing give you much more control over the titles used throughout your site. Read below for an overview of the specific features of the Element.
This is a H2 title with colour override
This is a H3 title with a separator
This is a H4 title
This is a H6 title
The Title Element is a handy element that allows you to add customised titles to your page content.
Step 1 – Create a new page or edit an existing one.
Step 2 – Add a container then select your desired column layout.
Step 3 – Click the ‘+ Element’ button to bring up the Elements window. Locate the ‘Title’ element and click it to bring up its options window.
Step 4 – The Title Element is very easy to use, and allows for some interesting customizations. To get started, on the General Tab, simply enter the Title content you wish to display. Then, on the Design Tab, you can customize the title.
Step 5 – The design options start with alignment, and then the HTML Heading Size you wish the title to have. A new feature, added in Avada 5.7, adds a font size override option, but otherwise the Title will take the font size of the corresponding Header size specified in the Theme Options Heading Settings. There are also override options for line height, letter spacing, margins and font color. As well as that there is a separator option built into the Title Element, which allows you to choose from any of Avada’s 9 preset separators, or not to use one at all. You can even choose the separator color.
Step 6 – Once you have completed adding your title, click Save. You will be returned to the edit page. You can preview the page to view the title, and you can always edit the element again to make changes.
Read below for a detailed description of all element options.
How To Use The Title Element in Fusion Builder Live
There are only a few differences when using the Title Element in the Fusion Builder Live Editor.
Being a text based Element, the Title Element is directly editable in the Fusion Builder Live Editor. And if you make a selection of text on the page, the Inline Editor appears, allowing you to make formatting changes to parts of your Title directly on the page.
Please see the Best Practices for Inline Editing in Fusion Builder Live document for a good idea of how to best use the Inline Editor.
Location: The edit screen within each Element.
You can deploy as many individual Elements in pages and posts as you need, there is no limit. Within each of the Elements, you will see a tab or tabs that house an array of options that make it possible for you to configure each Element independently, and greatly enhance your flexibility and creative options.
Note: The Default setting will use the global settings assigned for this element in your Theme Options > Fusion Builder Elements > Title Element section.
- Title – Add the Title Content here in plain text. Formatting occurs primarily on the Design tab. Although some of the built-in Visual Editor functions will work here, like changing the font color, bold, italic etc., it is best practice to control the general appearance of your Titles through the Theme Options for them (Avada > Theme Options > Typography > Headers Typography), and the Design Options in the Title Element itself.
- Element Visibility – Allows you to control the Separator’s visibility. Choose one or more between Small Screen, Medium Screen, or Large Screen.
- CSS Class – Allows you to add a class name to the wrapping HTML element. The class name does not have to be unique, but all areas with the same name will reflect any changes made to the class.
- CSS ID – Allows you to add an ID to the wrapping HTML element. The ID must be unique to each CSS ID.
- Title Alignment – Allows you to control the Header Element alignment. Choose from Left, Center, or Right.
- HTML Heading Size – Choose the size of the HTML heading tag that should be used. From H1 – H6.
- Font Size – New in Avada 5.7. Controls the font size of the title. Enter value, including any valid CSS unit, ex: 20px. If this is left empty, the Global font size (Avada > Theme Options > Typography > Header Typography) for the corresponding header size will be used.
- Line Height – Controls the line height of the title. Enter value including any valid CSS unit, ex: 28px.
- Letter Spacing – Controls the letter spacing of the title. Enter value including any valid CSS unit, ex: 2px.
- Margin – Controls the spacing above and below the title. In px, em or %.
- Font Color – Allows you to override the global color for the corresponding header size without using CSS.
- Separator – Choose the kind of Title Separator you wish to use. Default value is set in Theme Options (Avada > Theme Options > Fusion Builder Elements > Title Element).
- Separator Color – Choose the Separator Color or leave blank to use the default value.
Location:WordPress Dashboard > Avada > Theme Options > Fusion Builder Elements > Separator Element
The Avada Advanced Options Network gives you amazing flexibility with additional Global Options that allows you to control individual Elements en masse.
- Title Separator – Controls the type of title separator that will display. Choose from Single Solid, Single Dashed, Single Dotted, Double Solid, Double Dashed, Double Dotted, Underline Solid, Underline Dashed, Underline Dotted, and None.
- Title Separator Color – Controls the color of the title separators.
- Title Top/Bottom Margins – Controls the top/bottom margin of the titles. Leave empty to use corresponding heading margins. Enter values including any valid CSS unit, ex: 0px, 31px.
- hide_on_mobile – Choose from small-visibility, medium-visibility or large-visibility. You can select more than one setting. This will show the element on the selected visibility options, and will hide them on the deselected ones.
- class – Add a custom class to the wrapping HTML element for further css customization. Learn more here.
- id – Add a custom id to the wrapping HTML element for further css customization. Learn more here.
- content_align – Choose from left, or right. Sets the heading’s alignment.
- size – Choose from 1, 2, 3, 4, 5, or 6. These numbers represent H1-H6 heading sizes, respectively.
- font_size – Controls the font size of the title. Enter value including any valid CSS unit, ex: 20px.
- line_height – Controls the line height of the title. Enter any valid CSS unit, ex. 28px.
- letter_spacing – Controls the letter spacing of the title. Enter value including any valid CSS unit, ex: 2px.
- margin_top – Accepts a pixel value. For example, 5px. Sets the top margin.
- margin_bottom – Accepts a pixel value. For example, 5px. Sets the bottom margin.
- text_color – Controls the color of the title, ex: #000. Leave empty if the global color for the corresponding heading size (h1-h6) should be used.
- style_type – Choose from default, single solid, double solid, underline solid, single dashed, double dashed, underline dashed, single dotted, double dotted, underline dotted or none. Sets the separator style.
- sep_color – Accepts a hexcode ( #000000 ). Sets the separator’s color.
- custom content – Insert the custom title between thetags.
Related Articles
Do you want to split a WordPress post or page title into a new line? By default, your post title is just a single heading, and you cannot break it into a new line. In this article, we will show you how to split post or page title in WordPress.
Difference between Split Title and a Subtitle in WordPress
Splitting a post or page title allows you to break the title into a new line without changing formatting or style.
On the other hand, a subtitle allows you to add two different headings for your WordPress post or page.
See our tutorial on how to add subtitle for posts and pages in WordPress for detailed instructions.
Having said that, let’t see how to split post or page title in WordPress without writing any code.
Split Post or Page Title in WordPress
First thing you need to do is install and activate the Page Title Splitter plugin. For more details, see our step by step guide on how to install a WordPress plugin.
Upon activation, you need to edit a post or page where you want to split the title. On the post editor screen, you need to click on the little button below the title field.
Clicking on the button will add a pointer below the title field. You will need to click on the pointer to select it.
After that you can move the cursor inside text field to the point where you want to split the title.
You can also add multiple split points to break your title into more lines. Just click on the icon and then move the marker by selecting and putting the cursor at the right place.
You can also delete a marker. Just click on a marker to select it, and you will notice that the title splitter button will turn into a close button. Clicking on it will remove the title splitting marker from your post title.
Once you are finished adding and adjusting the split marker, you can just save or publish your post.
You can now visit the post or page to see the split post title on your website.
We hope this article helped you learn how to split post or page title in WordPress. You may also want to see our guide on how to add a reading progress bar with your WordPress posts.
If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.