Text module

Text alignment

Each module provides a setting where you can change alignment. Click the gear icon to edit the module, and change the alignment in the "common" tab of the settings panel.

As with other settings, the alignment applies to the entire module of text. If you would like to have different alignment for different bits of text, create multiple text modules and alter the alignment of each as needed.

Applying formatting to text

When you type in a text module, the "Normal" text type will create text as regular paragraph text. This means that your website will use typical <p></p> tags for your text. But you also have options to choose other heading types to affect the underlying HTML markup. Most types are available from a dropdown, but lists are created using buttons in the toolbar.

Applying Font Styles to text formats

Each module inherits the default font styles (if set) for every text type. These style selections are visible when editing the module. For example, if you set a default style for h1 text in "Font Styles > Defaults" that is the style that will be used when you choose h1 for your text.

If you change the text type, the style of the text will change based on your default settings. If you need to use something other than a default style, click the edit icon to choose an override style. Click the X icon to return to the default. Below is a demonstration showing how to change text types and apply or remove overrides.

In many cases it may be easier to use a new text module for different text types, but you have the option have multiple types in a single module.

Change the text type of specific text by highlighting the text and choosing a type from the dropdown.

If none of the available font styles are what you are looking for, you have a few options:

1. Let's say you want to tweak your h2 elements everywhere on your site.  Maybe you want them all to be uppercase.  Just select the font style currently applied to your H2s and click the gear icon to edit that font style.  Changing the font style to uppercase will apply to all your H2s.
2. If you want to override the color or size of a font style, just in this one spot, you can click the override button.  This is useful, for example, if you are using a dark colored font style on a dark background, and want to make the font color white, but just in this one spot.
3. If you want to use an existing font style as the basis of a totally new font style, click the copy button.
4. Or, you can click the add new button to create a completely new font style from scratch.

To learn more about working with font styles, please click to read our separate guide about  Fonts & text styles for full details.

Words or phrases in your text modules can be set to behave as links to other pages or websites.

Highlight some text within your module and click the link button. A dropdown allows you to paste a URL address, and (optionally) choose to have the link open in a new browser window/tab of their browser.

The text will become a link to whatever address you paste or type in. (be sure to use the http:// or https:// at the beginning!)

Since links can have different appearance like color, underline, bold, etc. than the normal text, you can work with the options within your font style to change the appearance of links in your module. To learn more about working with font styles, please click to read our separate guide about  Fonts & text styles for full details.

When working with a new module, choosing to use a heading of H1, H2, H3, etc. will cause your page to use these tags for the entire content of your text module. You can use this method and add new modules for new heading types. Or, if you prefer you can highlight text and add multiple heading types in the same module. If default fonts are set up for headings then the appearance of the text will change when you change the heading type. But this can be overridden if you want. For example, you might want the default body text to apply to your h3 header in a certain module. You can do that.

Headings communicate to web crawlers the title for a section of your site content. For example, if you have a layout with an about section, you might begin this section with a text module which says "About Me" at the top. You can select the H1 type for your module to signify this is a heading for that part of your page. If you need sub-areas, you can nest sub-headings as H2, H3, and so on.

A note about H1, H2, H3 and SEO

It used to be true that websites needed to use headings in sequence down the page because web crawlers like Google expected the H1 tag to be the most important, top-level title of the page. Using more than one H1 in a website, for example, used to be considered bad SEO practice … back when we were tuning in to The Fresh Prince of Bel-Air and Blossom.

But this is the future. Google is smart and contextual, and no longer expects web pages to use heading tags in a particular order. In fact, the HTML5 spec no longer requires heading tags to appear inside the prior level heading tag as it once did.

SEO concerns with placing heading tags incorrectly and hurting your SEO ranking are long gone, so if you plan to use heading tags in your text modules, try to use them in sequence, but don't worry too much about it. If you're overly concerned, you can always start from the H3 tag and go from there.

Remember, ProPhoto automatically optimizes your website for SEO with best practices so extra tagging is generally less crucial, and definitely not as important to have specific unseen tag structures as simply having the proper content in your pages for people to actually read.