How to Change Text Color in the Online Store Using OzSpeed hPanel

Changing the text color in your online store is a simple yet impactful way to align your website’s design with your branding. Whether you want to highlight certain text or adjust the color for better readability, OzSpeed hPanel offers an intuitive way to customize text colors.

---

Step 1: Log in to hPanel #

1. Visit OzSpeed hPanel.
2. Log in with your credentials.
3. Navigate to the Website Builder or Design Settings section.

---

Step 2: Access Text Styling Options #

1. In the Website Builder, select the page or section you want to edit (e.g., product pages, homepage, or checkout).
2. Click on the text element you want to modify. This could include headers, product descriptions, buttons, or other text blocks.

---

Step 3: Change Text Color #

1. Once the text element is selected, look for the Text Settings panel.
2. Locate the Text Color option.
3. Choose from the following options:
   • Default Colors: Select a predefined color from your theme palette.
   • Custom Color: Use the color picker to select a specific shade or enter a HEX, RGB, or HSL color code.

---

Step 4: Apply Changes to Multiple Elements (Optional) #

1. To apply the same text color to multiple elements:
   • Go to Global Design Settings > Typography.
   • Adjust the text color for headers, body text, or links.
   • Save the changes to apply them site-wide.
2. You can also set different colors for specific sections like product pages or the footer.

---

Step 5: Preview and Save #

1. Click Preview to see how the changes look on your website.
2. Ensure the text color contrasts well with the background for readability.
3. Click Save and Publish to make the changes live.

---

Troubleshooting Tips #

1. Text Color Not Changing:
   • Ensure you are editing the correct element or section.
   • Check if the element is inheriting styles from a parent container or theme settings.
2. Color Looks Different on Devices:
   • Test the color on multiple devices to ensure it appears consistent across screens.
   • Adjust brightness or contrast settings in your design if needed.
3. Text Hard to Read:
   • Use contrasting colors between text and the background.
   • Avoid light text on light backgrounds or dark text on dark backgrounds.

---

Additional Tips: #

• Highlight Key Sections: Use a bold or contrasting color for CTAs like “Add to Cart” or “Buy Now.”
• Stick to Your Branding: Use colors consistent with your logo and overall branding to create a cohesive design.
• Test Accessibility: Ensure your text color meets accessibility standards by using tools like the WebAIM Contrast Checker.