X (Twitter) element

About X (Twitter) Feed Element

PageFly X (Twitter) Feed element (rebranded as X) is designed to integrate the social network into your page to boost your conversion rate. This element can be used to add social proof for your products and store or introduce the social media pages of your brand to the visitors.

X is one of the most popular social platforms in the world, as it helps to connect with your customers more easily, despite their location and nationality. Using PageFly X (Twitter) element also shows professionalism and customer support dedication, as it helps your customers reach you and your brand community in a much simpler way!

How To Access X (Twitter) Element

• Step 1: Click on the Elements icon > In the PageFly tab choose the X (Twitter) feed element
• Step 2: Drag and drop the element you want into the editor and then start using it

How To Configure The X (Twitter) Element

X (Twitter) feed element comes with plenty of parameters allowing you to fine-tune content appearance for the best possible conversion rate.

Select the element in the layout and navigate to the General and Styling tabs to view its settings.

General Settings

Twitter URL: Enter your store’s Twitter URL
Content loading: Optimize the element’s content loading time. You have 2 options: Lazy load or Standard Lazy load: Content load only when visible in the viewport, improving PageSpeed Standard: Balances loading time and user experience.
Overall width: Adjust the width of the X (Twitter) element. Feed box (max value is 1000 px)
Overall height: Adjust height of the X (Twitter) element. Feed box (max value is 1000 px)

You can get further information about ATTRIBUTES, VISIBILITY, ANIMATION parameters in the General tab here.

Styling Settings

Spacing: Adjust margins and padding to create desired space around the X (Twitter) element
Border: Customize the border style and set the border radius for rounded corners.
Effects: Enhance the visual appearance of the X (Twitter) element using these parameters: Opacity: Adjust the transparency level of the element, ranging from 0% (completely transparent) to 100% (fully opaque). Enable shadow: Toggle this option to add a shadow effect to the element.
Display Note: This parameter group is only available in the Basic Editor. You can choose from the following display types: Inline: The element will be displayed inline with other elements, allowing them to flow within the same line. Block: The element will occupy the full width of its parent container, starting on a new line. Flex: This option allows for more complex layouts using flexbox properties. If you select Flex, you can further configure the following settings: Flex direction: Sets the direction of items (row or column). Flex wrap: Controls item wrapping onto multiple lines. Align items: Aligns items along the cross axis. Align content: Aligns flex lines within the container. Justify content: Aligns items along the main axis.

You can check more information about the Styling tab here.

Tips And Best Practices

The X (Twitter) Feed element is a powerful tool for integrating social media into your website or Landing page. You should place the X (Twitter) feed element in a prominent location on your page where visitors are likely to see it.

Additionally, ensure that all of the pictures or visuals you add in X (Twitter) feed are high-resolution and visually appealing. This will help capture the attention of your visitors and make your feed more engaging.

What’s more, you should keep your X (Twitter) feed consistent with your brand’s color scheme and overall aesthetic. This will help reinforce your brand identity and create a cohesive experience for your visitors.

Frequently Asked Questions

How many X (Twitter) accounts are there in 2023?

353.9 million users

Do I need to install X (Twitter) using the API for my PageFly page?

No, you only need your X (Twitter) URL.

Version Updates

Version 4.23.0

In version 4.23.0, PageFly allows customers to choose between the Gen 2 editor (with flex sections and blocks) and the Legacy editor (with columns and rows). With this change, the settings for the X element have been slightly modified: the Display settings have been removed from the styling options in the Flex editor.

Version 4.15.0

In version 4.15.0, we’ve added a new “Content Loading” setting with two options to optimize the loading experience and improve page speed on the live preview:

• Lazy Loading: Contents will only load when they enter the user’s viewport, reducing initial load time and conserving bandwidth.
• Standard: Contents load normally, which may provide a smoother experience for users with fast internet connections.