# Twitter feed

### About X (Twitter) Feed Element

PageFly [X (Twitter) Feed](https://help.pagefly.io/manual/twitter-element/) 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

![](/files/meOgF2tmIDDQ3LHDNKVO)

### 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.

![](/files/2lAyWzdzwrPrMVDzYlmf)

#### General Settings

| Twitter URL: Enter your store's Twitter URL                                                                                                                                                                                                                                                                  | ![](https://lh7-rt.googleusercontent.com/docsz/AD_4nXfC4NjwlDHHR7en9Jq_nnUA9ew3oi2_cjVyvm9Y2dVbMlP9g_3NYrhBS6dLvNp82vnI2CTu9r2o1i8sCE0MowHFNHNCHUC1iPkbM9Lpo1HNq7_pcbnA2ap9a1pafTjBD1zHNQ_CScV_ZHxJ8tc-vEUN13IP?key=rf4MAJPplu3yVFPmiOfmWw) |
| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| <p>Content loading: Optimize the element's content loading time. You have 2 options: Lazy load or Standard</p><ul><li>Lazy load: Content load only when visible in the viewport, improving PageSpeed</li><li>Standard: Balances loading time and user experience.</li></ul><p><br></p><p><br></p><p><br></p> | ![](https://lh7-rt.googleusercontent.com/docsz/AD_4nXdKCVY4AFySTpTNtXEdwAEzmcDPKF0bxtFHFwivPTJ90cG5fJgxBS8LBmWoN0qoUW5qpgMetQ8iIMsuVRPuLdL1Cyu8EJGf9cHn8ppf79fFwK7hoPGh5tJ_HlDdSfBB8QP4U5eQFuQs3ZOMpv6b0zYfjjM?key=rf4MAJPplu3yVFPmiOfmWw)  |
| Overall width: Adjust the width of the X (Twitter) element. Feed box (max value is 1000 px)                                                                                                                                                                                                                  | ![](https://lh7-rt.googleusercontent.com/docsz/AD_4nXck1YQmAIuEqas18llDE-EvhgD5tSZx4-W_bENs2kOXcnP4hGD_aekhQxp_qWkb1wi7gmYFCrpMH7FOH8zrnzPQVzQE3G50Zdal9SS9NzcjWwwsfyoEIJXgZHM9Khb73NDAtRWWfMc7bP2-08r9svrlT8Q?key=rf4MAJPplu3yVFPmiOfmWw)  |
| Overall height: Adjust height of the X (Twitter) element. Feed box (max value is 1000 px)                                                                                                                                                                                                                    | ![](https://lh7-rt.googleusercontent.com/docsz/AD_4nXcg0023R1KZv3rJKRBanpioDQ3o4KLjDXALTFlA_pc0IFl30C1TuABnYPXILim8-QWbOl_SM5Jv803NZDlMZtK4C6E3zmOqOKjFqN7iFXHVD2mmNQr81SOKQ8vWReRonAkif_MiYJONuLtjRHRnfDJDcN0?key=rf4MAJPplu3yVFPmiOfmWw)  |

You can get further information about ATTRIBUTES, VISIBILITY, ANIMATION parameters in the General tab [here](https://help.pagefly.io/manual/elements-general-settings/).

#### Styling Settings

| Spacing: Adjust margins and padding to create desired space around the X (Twitter) element                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                           | ![](https://lh7-rt.googleusercontent.com/docsz/AD_4nXf1zozSmFiZFpUH6nKQTIbhW3ozM3ZYKrIqWM374nZPOymPTRoe58o1QdQom8GZdensz97f3yAfD_p--wY-8dZ5Y5YZfR_LhXESDIZSmuJCpAVe1MGuX-cO00Pa8jkoIzv_ft3OEKzehQyfvTeqhdxcwSIA?key=rf4MAJPplu3yVFPmiOfmWw) |
| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Border: Customize the border style and set the border radius for rounded corners.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    | ![](https://lh7-rt.googleusercontent.com/docsz/AD_4nXfHQJtalvLYUUa-ZcGT7AAcvHM1uUaxtgklCcc3yumTbwn_Urn60Aq7CUlfbffRcaSV7ljXGHH5ouJSZFx077EdDkUq8qVJX6eDrBLnvkm26QLVqgEedL5LY7J_bcgmSG9eYAHOHE9-SJwz3ctNb5z_mpc?key=rf4MAJPplu3yVFPmiOfmWw)  |
| <p>Effects: Enhance the visual appearance of the X (Twitter) element using these parameters:</p><ul><li>Opacity: Adjust the transparency level of the element, ranging from 0% (completely transparent) to 100% (fully opaque).</li><li>Enable shadow: Toggle this option to add a shadow effect to the element.</li></ul>                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                           | ![](https://lh7-rt.googleusercontent.com/docsz/AD_4nXfof41S7NjKFkiRYhj_5cRquRu4BPo_uq0MJZHONuau_XndSVRCTkzI7gvljnBPEoISytdT8BEc0Pu-p6fmmG8G_jmg3a5qf3V9SlQOB-uWWMWv320f1pQRp37i1COfhEMTfutldovBkqkyovdIvVfVxyQ?key=rf4MAJPplu3yVFPmiOfmWw)  |
| <p>Display</p><p>Note: This parameter group is only available in the Basic Editor.</p><p>You can choose from the following display types:</p><ul><li>Inline: The element will be displayed inline with other elements, allowing them to flow within the same line.</li><li>Block: The element will occupy the full width of its parent container, starting on a new line.</li><li>Flex: This option allows for more complex layouts using flex-box properties. If you select Flex, you can further configure the following settings:</li><li><p>Flex direction: Sets the direction of items (row or column).</p><ul><li>Flex wrap: Controls item wrapping onto multiple lines.</li><li>Align items: Aligns items along the cross axis.</li><li>Align content: Aligns flex lines within the container.</li><li>Justify content: Aligns items along the main axis.</li></ul></li></ul> | ![](https://lh7-rt.googleusercontent.com/docsz/AD_4nXdJqRnVsov9Li3Xt4QKKZq6fxfJpzpfcfm9Eb6NHsFA2FcjTCdtF7JBXd1tx4rTjF7yw0FnnJ-RDQAFPtJBnv5xT2aaP6CVwixEf5iSffl-WOF02vDVvZElvj3vYodWnawwWUqlwOOoBLHxHNyPK8nKrRvq?key=rf4MAJPplu3yVFPmiOfmWw) |

You can check more information about the Styling tab [here](https://help.pagefly.io/manual/elements-style-settings/).

### 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.

{% hint style="warning" %}
**Important Note**: Gen 2 Layout will be available exclusively for Pay-as-you-go pricing model ([slot plans](https://help.pagefly.io/manual/pricing-plans/)).
{% endhint %}

**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.

{% hint style="info" %}
**Note**: Select the option that best balances performance and user experience for your specific use case and target audience.
{% endhint %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://help.pagefly.io/page-structure-and-elements/pagefly-elements/social/twitter-element.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.