Announcements

Announcements Documentation

Overview

The Announcements feature allows you to display important messages or notices to your users at the top of every page on your website. These announcements appear below the navigation bar and are fully customizable in terms of styling, content, and scheduling.

Accessing Announcements

  1. Navigate to the Admin Panel

  2. Go to Customization > Announcements

Creating a New Announcement

Basic Information

  1. Click Create Announcement button in the top right corner

  2. Complete the required fields:

    • Content: The main message of your announcement (required)

    • Title: Optional headline for your announcement

    • Color: Choose from 12 preset colors that affect both text and background styling

    • Icon: Optional icon to display next to your content

    • Link: Optional URL to direct users to more information

Advanced Options

  • Status: Toggle to make the announcement active/inactive

  • Scheduling: Set specific start and end dates/times for automatic display

Preview

As you customize your announcement, a live preview appears showing exactly how it will look to your users.

Saving

Click Create Announcement to save your new announcement.

Managing Existing Announcements

Viewing Announcements

The main announcements page displays all announcements in a table with the following information:

  • Title (if set)

  • Content

  • Color (visual badge)

  • Icon (if set)

  • Status (Active/Inactive toggle)

  • Schedule (if set)

  • Actions (Edit/Delete)

Reordering Announcements

  • Drag announcements using the handle icon (≡) to change their display order

  • Top announcements appear first when multiple are active

Quick Actions

  • Toggle Status: Click the status badge to instantly activate/deactivate

  • Edit: Click the edit button to modify announcement details

  • Delete: Remove unwanted announcements

Best Practices

Effective Announcements

  1. Be Concise: Keep messages brief and actionable

  2. Use Color Wisely:

    • Red: Urgent/important notices

    • Blue: General information

    • Green: Positive updates/success

    • Yellow: Warnings/cautions

  3. Add Relevant Icons: Choose icons that visually represent your message

  4. Include Links: Direct users to relevant actions or information

Scheduling Tips

  • Use scheduling for time-sensitive announcements (promotions, events)

  • Plan announcements in advance

  • Avoid overlapping multiple high-priority announcements

Display Considerations

  • Multiple active announcements stack vertically

  • Users can dismiss announcements (dismissed state persists using browser storage)

  • Announcements are responsive and display well on all devices

Common Use Cases

  1. Site Maintenance: Notify users of scheduled downtime

  2. Promotions: Highlight special offers or events

  3. Feature Updates: Announce new functionality

  4. Important Notices: Communicate policy changes or important information

  5. Seasonal Events: Display holiday-specific messages

Troubleshooting

Announcement Not Showing

  1. Verify the announcement is Active

  2. Check scheduling settings (if used)

  3. Ensure the announcement hasn't been dismissed by users

Styling Issues

  1. Preview how announcements look with different colors

  2. Test icon visibility with chosen color scheme

  3. Use the preview feature to catch display issues before saving

Last updated