Centered text section

Apply to all sections

To apply centered title text to all main type sections follow these steps:

1. Create a main type section on a page
2. Enter the title text and save
3. Go back to the web projects homepage and click Settings then Code Injection
4. Copy and paste this code into the "Tag code <head/>" box

   <style>
   .OverrideMainBlock--container {
   margin-bottom: -4rem;
   }
   .OverrideMainBlockContainer--first-slot {
   align-items: center;
   justify-content: center;
   margin: auto;
   }
   .OverrideMainBlock--title,
   .OverrideMainBlock--description {
   text-align: center;
   }
   </style>

5. Click the checkbox to confirm that the code is safe and then click "Save".

Apply to specific sections

1. Create a main section on a page,
2. Enter the title text and save,
3. Click the button with the table icon next to the section,
4. Click "Add" and enter "class" in the "Key" field and then "CenteredText" in the "Value" field and click "Save",
5. Go back to the web projects homepage and click Settings then Code injectione,
6. Copy and paste this code into the "Tag code <head/>":

   <style>
   .CenteredText .OverrideMainBlock--container {
   margin-bottom: -4rem;
   }
   
   .CenteredText .OverrideMainBlockContainer--first-slot {
   align-items: center;
   justify-content: center;
   margin: auto;
   }
   
   .CenteredText .OverrideMainBlock--title,
   .OverrideMainBlock--description {
   text-align: center;
   }
   </style>

7. Click the checkbox to confirm that the code is safe and then click "Save".

Now all the sections you add with the CenteredText class in the metadata will get the style with the centered text.