Step 1: Log In to Personalize Your Widgets
- Open the Dashboard Login Screen: Launch your browser and head to the astrology dashboard login portal.
- Fill in Your Login Details: Type in your registered email address and password. (Click on "Forgot Password" if you’ve forgotten your login credentials.)
- Access Your Account: Hit the "Sign In" button to enter your dashboard.
Don’t Have an Account Yet? Click on "Sign Up" to create one and begin your journey with astrology widgets.
Step 2: Navigate to the Dashboard
After logging in, you will be directed to the main dashboard. Here, you can access multiple features like subscriptions, billing, API keys, and widgets.
- Locate the Widgets option in the left-hand menu.
- Click on it to view and manage your Choghadiya widgets.
Step 3: Select the Desired Widget
In the widget section, you’ll find a list of available widgets, such as Horoscope, Indian Astrology, and Tarot Widgets. Select Indian Astrology to proceed and then choose the Choghadiya option.
Step 4: Integrate the Natal Widget
Access the Customization Panel:
- Open the panel after selecting the Choghadiya widget to view integration methods.
Integration Options Available:
- Option 1: Script Code Snippet: Insert this code into your site’s HTML.
- Option 2: Iframe Code Snippet: Use iframe embedding, ideal for flexibility.
- Option 3: WordPress Shortcode: Copy the shortcode for WordPress and paste it into a page or post.
- Note: Ensure the WordPress plugin is installed and activated for shortcode use.
Embed Your Code:
- Click the copy icon, then paste your code into the correct section of your website.

Step 5: Preview Choghadiya Content
The widget preview section displays daily Choghadiya details, including Day Choghadiya and Night Choghadiya, along with specific Good, Bad, or Neutral timings for each period. Users can toggle between Previous Day, Today, and Next Day to view the Choghadiya timings for different dates.
- This helps you understand how the widget will look on your website.
- Ensure the content is engaging for your target audience.
Step 6: Configuring the Widget
Customize the widget's appearance and functionality to align with your page design and user preferences. Follow these steps:
1. Change the Setting Name:
Creating a New Setting:
- Start by clicking the “+ Create New Setting” button at the top-right of the dashboard.
- Provide a unique name, like "Choghadiya - Modern Style," for easy identification later.
- Adjust the widget’s design by selecting preferred colors, fonts, and layouts to match your branding.
Editing an Existing Setting:
- From the “Choose Your Setting” dropdown, find the setting you wish to edit.
- Tap on “Edit Setting” to open the customization panel.
- Refine your widget by adjusting the visibility of sections, changing visuals, or updating other features.
Refer to our step-by-step guide for more details on managing widget settings.
2. Change the Setting Name:
- Locate the Setting Name field in the settings panel.
- Enter your desired name to label this configuration.
3. Update the Color Scheme:
- Navigate to Color Scheme Settings: Open the customization menu and select the Color Scheme option.
- Choose a Pre-set Theme: Select from themes such as Light, Light Accent, Accent, Dark, and Dark Accent to fit your brand's style—be it modern, vibrant, or subtle.
- Personalize the Colors: Fine-tune the theme by customizing individual elements.
- Edit Using the Pencil Icon: Adjust specific settings, such as:
- Primary Colors: Applied to the widget’s main elements like Background, Titles, and Text.
- Secondary Colors: Applied to secondary features, creating contrast and balance.
4. Adjust the Fonts:
Open the Font Settings Panel:
- Click on the "Fonts" section in your widget settings to access font options.
Select and Preview Fonts:
- Pick a font that aligns with your website’s look and feel. Experiment with different options to find the perfect fit.
Real-Time Updates:
- Changes are applied instantly, and the widget preview reflects your selection, allowing you to make informed decisions.
5. Heading and Subheading
Customize the widget's heading and subheading to align with your website's style and message.
Heading:
- Enter your desired title in the Heading field (e.g., "Choghadiya").
Subheading:
- Add a brief description in the Subheading field (e.g., "Choghadiya").
Note:
You can personalize these texts to suit your needs. Changes will reflect instantly in the widget preview..
Step 7: Use the Preview Functionality
To ensure your horoscope widget looks perfect across all devices, use the Preview Functionality located in the top-right corner of the customization screen. This feature allows you to switch between different device views:
- Desktop View: See how the widget appears on a large screen.
- Tablet View: Preview how it will display on medium-sized devices like tablets.
- Mobile View: Check the responsiveness and layout on mobile screens.
Toggle between these views to ensure the design, fonts, and content remain consistent across all devices. This step helps you deliver a seamless user experience for all your visitors.
Step 8: Final Steps to Integrate Your Widget
Save Your Changes:
- Click Save to finalize and store all customizations.
Return to Dashboard:
- Tap the Back button at the top of the page to go back to the widget’s main settings area.
Review the Widget:
- Scroll through the preview section to ensure everything looks and works as expected.
Embed the Code:
- Copy the integration code snippet and insert it into your site’s HTML or CMS platform.
Verify Widget Performance:
- Test the widget on your site to ensure it functions correctly and aligns with your website’s aesthetics.

Conclusion
By following these steps, you can seamlessly integrate a Choghadiya widget into your page, helping users find the best times for important tasks based on traditional Hindu timing. The widget’s city and date selection enhances user experience by allowing them to view Choghadiya for any location and date, making the information both accessible and user-friendly.