Enhance audience engagement effortlessly with our state-of-the-art Twitter Integration Modules for Divi. These advanced modules allow seamless embedding of Twitter’s powerful features directly onto your website, offering a range of customization options to suit your brand’s unique style. Whether your goal is to showcase live tweets, increase follower counts, or enable easy content sharing, our modules provide full responsiveness across all devices, ensuring a cohesive look and experience for your audience. Boost your site's social connectivity and user engagement without compromising on design, driving visibility and interactions that align with your brand’s identity. Let your website thrive with integrated social interactions that capture attention and foster connections.

In this documentation, we’ll guide you through each feature, customization option, and step-by-step setup process to help you get the most out of these Twitter Integration Modules.

Twitter Timeline

The DG Twitter Timeline Module enables you to embed a live Twitter feed onto your webpage, making it easy to showcase tweets from any Twitter account. This guide provides step-by-step instructions for configuring and customizing the Twitter Timeline module, enhancing user experience with your social media content.

Module Setup: Inserting the Twitter Timeline Module

  1. Activate Divi Grid: Ensure Divi Grid is activated, as it adds additional modules like the DG Twitter Timeline to your Divi builder.
  2. Add the Twitter Timeline Module:
    • Open a page or post that uses the Divi builder.
    • Add or edit a row, then click on Add New Module.
    • Select DG Twitter Timeline from the module options.

Content Tab: Adding and Configuring Twitter Timeline

  1. Adding Twitter Timeline:

    • Go to the Content tab.
    • Locate Twitter Name and in Twitter Username, enter the Twitter handle (username) of the account you want to display.

  2. Customizing Twitter Theme:

    • Change the appearance of the timeline by navigating to Twitter Name Settings and adjusting the Theme option.
    • Select either Light or Dark to match your website’s design.

Twitter Timeline Settings: Display Options and Customizations

  1. Limit Tweets:

    • Description: This option allows you to set a maximum number of tweets to display. If left off, the module will show the default number of tweets.
    • Setting: Toggle switch (On/Off).

  2. Display Header:

    • Description: Choose to display a header at the top of the Twitter feed, which includes the Twitter account name and handle.
    • Setting: Toggle switch (Yes/No).

  3. Display Footer:

    • Description: Enable this option to add a footer, which often includes options to follow the Twitter account or view more tweets.
    • Setting: Toggle switch (Yes/No).

  4. Add Borders:

    • Description: Adds a border around the Twitter feed for visual separation from other elements on the page.
    • Setting: Toggle switch (Yes/No).

  5. Set Transparency:

    • Description: When enabled, removes the background color of the Twitter feed, allowing it to blend with your website’s design.
    • Setting: Toggle switch (Yes/No).

  6. Show Scrollbar:

    • Description: Enable this option to add a scrollbar within the Twitter feed. This is useful if you want to restrict the feed's area but allow scrolling.
    • Setting: Toggle switch (Yes/No).

  7. Set Max Width:

    • Description: Define the maximum width of the Twitter feed to ensure it fits within the desired layout on larger screens.
    • Setting: Numeric input (pixels or percentage).

  8. Set Max Height:

    • Description: Define the maximum height of the Twitter feed to control vertical space, especially for responsive design.
    • Setting: Numeric input (pixels or percentage).

Alignment: Adjusting the Module Placement

  1. Aligning the Twitter Feed:
    • Go to the Twitter Name tab and find Alignment.
    • Choose the alignment option that best fits the module within your page layout.

This documentation covers all the essential steps to configure and integrate the DG Twitter Timeline Module, making it simple to showcase a live Twitter feed on your site while maintaining a professional, cohesive design.

 

Twitter Embedded Tweet Module

The DG Twitter Embedded Tweet Module allows you to embed specific tweets directly on your webpage using the Divi builder. This guide provides a comprehensive overview of configuring and customizing the module to display tweets with various layout and display options.

Module Setup: Inserting the Twitter Embedded Tweet Module

  1. Activate Divi Grid: Ensure Divi Grid is activated to add advanced modules, including the DG Twitter Embedded Tweet, to your Divi builder.
  2. Adding the Twitter Embedded Tweet Module:
    • Open a page or post that uses the Divi builder.
    • Add or edit a row, then click on Add New Module.
    • Select DG Twitter Embedded Tweet from the module options.

Content Tab: Configuring Embedded Tweet Display

  1. Displaying a Specific Tweet:

    • Go to the Content tab.
    • Find Twitter ID and, in Tweet ID, enter the identification number of the tweet you wish to display.

  2. Show Conversation:

    • Description: This option allows you to display the conversation thread associated with the tweet, offering more context.
    • Setting: Go to Content tab > Settings > Show Conversation and toggle the switch to enable this feature.

  3. Display Tweet Media Cards:

    • Description: Show attached media such as images, videos, or link previews directly within the embedded tweet.
    • Setting: Go to Content tab > Settings > Show Cards and toggle the Show Cards switch to enable this option.

Display Settings: Enhancing Embedded Tweet Appearance

  1. Aligning the Twitter Feed:

    • Description: Adjusts the positioning of the embedded tweet within your page layout.
    • Setting: Go to the Settings tab, find Alignment, and select the preferred alignment option.

  2. Change Tweet Theme:

    • Description: Switch between light and dark themes for the embedded tweet, enhancing readability and style.
    • Setting: Go to Settings > Theme and choose between Light or Dark.

  3. Adjust Tweet Width:

    • Description: Set the maximum width of the embedded tweet, controlling how much horizontal space it occupies on your page.
    • Setting: Inside the Display settings, adjust the Max Width field by entering a value or using the slider.

  4. Define Twitter Language:

    • Description: Specify the language code for displaying the tweet, ensuring content matches your site’s primary language.
    • Setting: Enter the desired language code in the Twitter Language field to display tweets in the specified language.

This documentation provides step-by-step instructions for setting up and customizing the DG Twitter Embedded Tweet Module within Divi, enabling you to enhance your webpage with embedded tweets tailored to your design and layout preferences.

 

Twitter Share Module

The DG Twitter Share Module allows you to create a customizable Twitter sharing button on your webpage, enabling users to easily share content with their followers. This guide provides a step-by-step approach to setting up and configuring the module effectively.

Module Setup: Inserting the Twitter Share Module

  1. Activate Divi Grid: Ensure that Divi Grid is activated to access the additional modules in the Divi builder.
  2. Adding the Twitter Share Module:
    • Create or edit a page/post that uses the Divi builder.
    • Create or edit a row within the page/post.
    • Click on the Add New Module option and select DG Twitter Share from the module list.

Content Tab: Configuring Share Options

  1. Adding Custom Share Text:

    • Description: Input custom text to be included in the tweet when users share your content.
    • Setting: Navigate to the Content tab, find Share Element, and enter your desired text in the Custom Share Text field.
      • Note: Keep in mind the Twitter character limit of 280 characters when crafting your message.

  2. Adding Page URL for the Tweet:

    • Description: Specify the URL that will be included in the tweet.
    • Setting: Go to the Share Element settings and enter the desired link in the Tweet URL field.

  3. Adding Hashtags:

    • Description: Enhance tweet visibility by including relevant hashtags.
    • Setting: In the Share Element settings, find Hashtags and input your desired tags.

  4. Associating Twitter Username for Attribution:

    • Description: Credit a specific Twitter username in the tweet.
    • Setting: Go to the Share Element, find Via, and input the Twitter username you want to associate.

  5. Mentioning Related Twitter Accounts:

    • Description: Mention other Twitter accounts to increase engagement and visibility.
    • Setting: Navigate to the Share Element settings, find Related Accounts, and input the Twitter usernames of the accounts you want to mention.

Button Settings: Customizing Appearance

  1. Changing Twitter Share Button Size:

    • Description: Control the size of the Twitter share button to fit your design.
    • Setting: Go to the Button Settings tab, locate Size, and choose between Large or Small options.

  2. Aligning the Twitter Share Module:

    • Description: Adjust the positioning of the Twitter share button within your page layout.
    • Setting: In the Button Settings tab, find Alignment and select your preferred alignment option.

Language Configuration

  1. Defining Twitter Language:
    • Description: Specify the language code to ensure tweets display in the desired language, aligning with your site's primary language.
    • Setting: Enter the desired language code in the Twitter Language field.

This documentation serves as a comprehensive guide for setting up and customizing the DG Twitter Share Module within Divi, allowing you to create an engaging and user-friendly sharing experience for your website visitors.

 

 

Twitter Follow Module 

The DG Twitter Follow Module allows you to easily add a Twitter follow button to your website, enabling users to follow your Twitter account directly from your page. This guide outlines the steps to add and configure the module effectively.

Adding the Module to Your Page

  1. Activate Divi Grid: Ensure that Divi Grid is activated to access the additional modules in the Divi builder.
  2. Inserting the Twitter Follow Module:
    • Create or edit a page/post that utilizes the Divi builder.
    • Create or edit a row within the page/post.
    • Click on the Add New Module option and select the DG Twitter Follow module from the module list.

Content Tab: Configuring Follow Options

  1. Adding the Twitter Follow Button:

    • Description: Input your Twitter username to create the follow button.
    • Setting: Navigate to the Content tab, locate Twitter Name, and enter your Tweet Username in the designated field.

  2. Showing Twitter Username:

    • Description: Determine whether to display the Twitter username next to the follow button.
    • Setting: Go to the Content tab, find Settings, and set Show Username to NO if you do not want to display it.

  3. Hiding Twitter Followers Count:

    • Description: Control the visibility of the follower count.
    • Setting: Navigate to Display, find Show Count, and set it to NO if you wish to hide the follower count.

Aligning the Twitter Follow Button

  • Description: Adjust the positioning of the Twitter follow button within your page layout.
  • Setting: In the Twitter Name tab, find Alignment and select your preferred alignment option.

Changing Button Size

  1. How to Change Twitter Follow Button Size:
    • Description: Customize the size of the Twitter follow button to fit your design.
    • Setting: Go to the Display settings, find Size, and choose either Large or Small.

Language Configuration

  1. Defining Twitter Language:
    • Description: Specify the language code to ensure that the Twitter follow button and related content display in the desired language, aligning with your site's primary language.
    • Setting: Enter the desired language code in the Twitter Language field.

This documentation serves as a comprehensive guide for setting up and customizing the DG Twitter Follow Module within Divi, enabling you to provide an easy and engaging way for users to follow your Twitter account.