Exploring EverWeb’s Text Formatting Options

September 20th, 2018

EverWeb's Text Formatting Options

 

Text is always an important part of a website and EverWeb has a number of ways in which text can be easily formatted. Here are tips on how to get more creative with text in EverWeb.

 

1. Use Default Styles

One of the best ways to save yourself time and effort is by setting up the default text properties when you first create your website project. Use the Format-> Default Styles… menu option to set the default Body Text Font, Size and Color. When you add a TextBox to your page, the default settings will be applied. You can set up, or change, your Default Styles at any time. When doing so the changes will apply onto to new TextBoxes that you add to your page and not to ones that may be on the page already.

The Default Styles you set up for text properties will also be applied to the Styled Text Editor that will be featured in some of the new responsive widgets, and some updated existing widgets such as the PayPal Widget, in the next version of EverWeb.

 

2. The Text Inspector

EverWeb’s Text Inspector in the Inspector Window lets you customize text in ways that are not possible using the Fonts Panel or EverWeb’s menu system. there are a couple of settings that are good to be aware of. The first is the ‘After Paragraph’ option which is set to 15 pixels by default. The second is the horizontal and vertical text alignment buttons in the  Color & Alignment section of the Inspector. Horizontal text alignment is set to ‘Left’ and vertical text alignment is set to ‘Top’. If you are creating a button and you want the button text to be centered, set the After Paragraph setting to zero, horizontal text alignment to center and vertical text alignment to middle.

The Text Inspector’s Insert Margin is also useful if you have a Full Width TextBox on your page and want to create a left hand margin so that the text is not right up against the left hand edge of the page. This will also be useful when using Full Width TextBoxes in responsive pages in the next version of EverWeb. You will also be able to set left and right margins for Full Width objects from the Metrics Inspector in the next version of EverWeb which will give you greater control and flexibility whether you are developing a traditional or responsive website.

 

3. The Format Menu Option

The Format Menu is a great place to find options that save you from opening the Fonts Panel. The Format-> Font menu options include special case tools such as Superscript and Subscript. There are also options to quickly increase and decrease the size of your selected text with the ‘Bigger’ and ‘Smaller’ options, again saving you having to use the Fonts Panel.

The Format-> Transformations menu is perfect when you have set Caps Lock on by mistake. You can use either ‘Make Lower Case’, ‘Make Upper Case’ or ‘Capitalize’ menu options to change the selected text case with ease.

 

4. Shortcut Keys

One further use of the Format Menu is that it shows you the Shortcut keys for many text options which again should save you time.

 

Show Fonts (Fonts Panel): Cmd T

Bold: Cmd B

Italics: Cmd I

Underline: Cmd U

Subscript: Control Cmd –

Superscript: Shift Control Cmd +

Bigger: Cmd +

Smaller: Cmd –

Align Left: Shift Cmd {

Center: Shift Cmd |

Align Right: Shift Cmd }

Select All: Cmd A

 

5. The Fonts Panel

The last option for text styling is the Fonts Panel which can be accessed via the Toolbar or the Format-> Text-> Show Fonts menu. When using the Fonts Panel, the Cmd T shortcut key really comes in to its own as the quickest way to toggle the panel on and off.

The buttons in the Fonts Panel, from left to right, are for:

Text Underline

Text Strikethrough

 Text Color

Text Background Color

Text Shadow On/Off

Text Shadow Color

 

The four controls to the right of the buttons have the following functions:

  1. Triangle Symbol Slider: Used for shadow opacity. If the slider is set at the left the shadow appears invisible. If the slider is set to the right, the shadow color will be solid.
  2. Square Symbol with Shadow Background: This slider allows you to adjust the shadow blur. If set at the left end of the slider, there will be no blur, if set to the right end the shadow will be completely blurred and so not visible.
  3. Square Symbol: This allows you to set the offset of the shadow from the text. When set at the left of the slider there is no offset so you will see no shadow. At the right end of the slider you will have the shadow at maximum offset.
  4. Rotation Wheel: The last button is a rotation wheel so that you can change the angle of the shadow as required.

 

Coming Soon!

The next version of EverWeb will feature a lot more choices and flexibility in what you can do with text, especially within widgets. For a closer look, a public beta test of the new version is available in the Announcements Section of the EverWeb Discussion Forum.

 

 

 

EverWeb on Social Media

You can also find EverWeb on the following social media platforms:

Facebook

Google+

Flipboard

YouTube

Twitter handle @ragesw

 


Leave a Reply