HOW-TO
      Back to home
      1. Help Center
      2. HOW-TO

      How-to: Use a Text Editor to Edit Your Paragraph

      Confused about editing paragraphs in a text editor? If you're not familiar with HTML or CSS, this article can help with simple edits.

      Use the text editor to edit your paragraph formatting

       

      • The text editor in YouLi lets you choose a tag for the selected text format, such as HEADER 1, HEADER 2, or PARAGRAPH. You can also select FONT to change the font and 'A' to change the text color 

       

      You can also change the text format using the heading options, such as Paragraph Format, Font, and Color.



      • You can also edit the text using Classes, Styles, and Attributes.

       

      You can edit the text using Classes, Styles, and Attributes.

      Classes

      A Class is like a label you can add to specific elements on a page to make them share the same appearance or behavior. In the image above, you can see the CLASSES box on the left. This is used to assign a class to a heading or paragraph, allowing multiple elements to use the same.

      • The HTML class attribute specifies one or more class names for an element

      • Classes are used by CSS and JavaScript to select and access specific elements

      • The class attribute can be used on any HTML element

      • The class name is case-sensitive

      • Different HTML elements can point to the same class name

      Classes

      Styles

      A Style controls how an element looks. In the image, the STYLES box on the left allows you to add styles (like font size or color) directly to an element. By adding styles to different elements, you can control how they appear on the page.

      • Use background-color for background color

      • Use color for text colors

      • Use font-family for text fonts

      • Use font-size for text sizes

      • Use text-align for text alignment

      Styles

      Attribute 

      An Attribute provides extra information and helps the web page better understand an element. In the image, the ATTRIBUTES box allows you to add extra attributes to an element, such as a link’s target or alternative text for an image.

      • All HTML elements can have attributes

      • The href attribute of <a> specifies the URL of the page the link goes to

      • The src attribute of <img> specifies the path to the image to be displayed

      • The width and height attributes of <img> provide size information for images

      • The alt attribute of <img> provides an alternate text for an image

      • The style attribute is used to add styles to an element, such as color, font, size, and more

      • The lang attribute of the <html> tag declares the language of the Web page

      • The title an attribute defines some extra information about an element

       Attribute

      Example

      Create a class called HIGHLIGHT with a blue color and a font size of 30px. Assign it to this paragraph, and the paragraph will apply all the specified styles.

       How do they work together?

      Summary

      This text editor allows users to edit different headings and paragraphs and apply Classes, Attributes, and Styles to them. These work together to help you quickly adjust the look and functionality of your webpage.

      • Class: By assigning a Class to an element, you can set the same appearance rules for multiple elements.

      • Attribute: Adding an Attribute to an element provides extra information (such as a link’s target or alternative text).

      • Style: By applying a Style to an element, you adjust its appearance properties, such as color, size, and position.

      Understanding these basic concepts will help you better manage and design web pages without writing any code. The editor shown in the image illustrates how these concepts are applied to different elements, allowing you to customize your content better.

       

      Need more help?

      For more tips on pre-trip customer support join the YouLi community of travel professionals with monthly LIVE webinars and Q&A sessions.