Design Your Greetings & Farewells

To personalize the size and color of the greetings close button in your document, you can follow these steps. The close button is styled using CSS, and you can modify the code snippet below to achieve the desired appearance.

Identifying Customization Styles Section

Step 1: Accessing Appearance Customization

1.1 Navigate to Your Dashboard:

  • Log in to your dashboard or user interface.

1.2 Find the Appearance Section:

  • Look for an “Appearance” or “Customization” block within your dashboard. This is where you can control the visual aspects of your document or webpage.

Step 2: Access Additional CSS Page

2.1 Enter the Customization Section:

  • Within the “Appearance” block, find an option that leads you to further customization. This might be labeled as “Customize” or “Advanced Settings.”

2.2 Locate Additional CSS Page:

  • Once in the customization section, search for an “Additional CSS” page or option. This is the area where you can input and modify custom CSS styles.

Step 3: Insert or Modify Code

3.1 Paste the Provided CSS Code:

  • In the “Additional CSS” page, paste the provided CSS code for customizing the greetings close button. This code usually targets specific elements on the page.

3.2 Adjust Values as Needed:

  • Modify the values such as width, height, color, and background-color according to your preferences.

Within the block, find the CSS rules targeting the greetings close button. It should look similar to the following:

.ctc_greetings_close_btn svg {
    width: 20px !important;
    height: 20px !important;
    color: red !important;
    background-color: lightgrey !important;
}

Adjust Size and Color:

Modify the values of width, height, color, and background-color to customize the close button’s appearance. For example:

.ctc_greetings_close_btn svg { 
    width: 30px !important; /* Adjust width to 30 pixels */ 
    height: 30px !important; /* Adjust height to 30 pixels */ 
    color: blue !important; /* Change color to blue */ 
    background-color: lightgreen !important; /* Change background color to light green */ 
}

Step 4: Save Changes

4.1 Save Your Customization:

  • After pasting and adjusting the code, look for a “Save” or “Apply” button to save your changes.
  • By following these steps, you can easily access the appearance customization section, find the “Additional CSS” page, and apply custom styles to your greetings close button.
Feel free to experiment with different values to achieve the desired visual style for the greetings close button. If you encounter any issues or have further questions, refer to your document's customization guidelines or seek assistance from your document's administrator.

Leave a Comment

Your email address will not be published. Required fields are marked *

Scroll to Top