Add Manual CSS

What is a Manual CSS?

In any page if you want a different style then built in one from the theme, you can add you CSS code manually. We can call it as a Manual CSS.              

Note: CSS stands for Cascading Style Sheets. CSS describes how HTML elements are to be displayed on screen, paper, or in other media. CSS saves a lot of work. It can control the layout of multiple web pages all at once.

There may or may not a section or box to add a CSS code manually in any page.

So, let's see how to add a section or a box for Manual CSS.

Adding a Section for Manual CSS

  1. Go to the Userbar >> Structure >> Content Type >> select any content type that you would like to add Manual CSS section.
  2. Select Manage Field on the top right of the screen. Here the content type is Drupal User Guide. select the manage fields
  3. In the manage field you will see different adding options from them choose + Add new group lable it as a Manual CSS. 
  4. Select Widget as a Vertocal tab from the dopdown menu.
  5. Now + Add new field in a Manual CSS group. Name it as Manual CSS, select a field type Long text and summary and select a widget Text area with a summary. Click Save.
  6. You will see new screen of Manual CSS. Add some help text if you would like to add. Put how many rows you want, here we put 5 in Rows.
  7. Next in the Text processing select Plain text. For the rest keep everthing as a default and click Save settings.
  8. Go to the Userbar >> Content >> Add Content >> Select the page(content type) that you just added a field.
  9. At the bottom of the page you will see the Manual CSS section on the left hand side.
  10. Add you style here and se the effects on your webpage.