Skip to content

X (Twitter) Feed Template Styling & Connection ​

This guide will walk you through all the options in the Style and Connection tabs of the X (Twitter) Feed template editor.

While the General Settings tab controls what content is shown (e.g., your source, filters, and header), the Style tab controls the visual design. This is where you can change all the colors, fonts, spacing, and borders to perfectly match your brand and website's look.

Style Settings ​

The Style tab is organized into several sections, each controlling a different part of your feed.

1. Heading ​

This section controls the complete visual design of the Header at the top of your feed. The header is the main box that contains your profile information, like your cover photo, bio, and follower count.

Full Name

This styles your main Display Name (e.g., "WP Social Ninja").

  • Text Color: Sets the color of the Full Name text.
  • Typography: Opens a full set of font controls (Font Family, Size, Weight, etc.) for your Full Name.

User Name

This styles your Username (e.g., @wpsocialninja).

  • Text Color: Sets the color of the Username text.
  • Typography: Opens the full set of font controls for your Username.

Description

This styles your Profile Bio text.

  • Text Color: Sets the color of the bio text.
  • Typography: Opens the full set of font controls for your bio text.

Location

This styles the Location text shown on your profile.

  • Text Color: Sets the color of the location text.
  • Typography: Opens the full set of font controls for the location text.

Statistics Label

This styles the text label for your stats (e.g., the words "Followers," "Following").

  • Text Color: Sets the color of the label text.
  • Typography: Opens the full set of font controls for the label text.

Statistics Count

This styles the number for your stats (e.g., "1,250").

  • Text Color: Sets the color of the count number.
  • Typography: Opens the full set of font controls for the count number.

Follow Button

This styles the "Follow" button located inside the header.

  • Text Color: Sets the color of the text inside the button (e.g., "Follow Us").
  • Background Color: Sets the main background color of the button.
  • Typography: Opens the full set of font controls for the button text.

Box

This controls the overall container or "box" that holds all the header elements.

  • Background Color: Sets a background color for the entire header area.
  • Padding: This is the "breathing room" inside the header box, between the border and the content. You can set the padding (in pixels) for the Top, Right, Bottom, and Left sides individually.
  • Border Type: Lets you choose the style of the border for the header box (e.g., Solid, Dotted, Dashed, or None).

X template styling connection

2. Name ​

This section styles the Author's Name that appears on each individual tweet.

Author

  • Text Color: Sets the color of the Author's name on the tweet.
  • Typography: Opens the full set of font controls (Font Family, Size, Weight, etc.) for the Author's name.

X template styling connection

3. Meta ​

This section styles the "meta" information (like the username and date) on each individual tweet.

Username

This styles the Author's @username on the tweet.

  • Text Color: Sets the color of the @username text.
  • Typography: Opens the full set of font controls for the @username.

Date

This styles the Date (e.g., "Nov 7, 2025") on the tweet.

  • Text Color: Sets the color of the date text.
  • Typography: Opens the full set of font controls for the date.

X template styling connection

4. Content ​

This section styles the main body of the tweet itself.

Text

This styles the main text content of the tweet.

  • Text Color: Sets the color of the tweet's text.
  • Typography: Opens the full set of font controls for the tweet text.
  • Padding: Controls the "breathing room" around the text block only, letting you adjust the space between the text and other elements in the tweet card.

Hashtag

  • Hashtag Color: This is a special setting that controls the color of any clickable #hashtags inside the tweet. This helps them stand out from the rest of the text.

X template styling connection

5. Action ​

This section styles the "action bar" at the bottom of each tweet, which includes the Reply, Retweet, and Like icons and counts.

Label

This styles the count number next to each icon (e.g., the "150" next to the heart).

  • Text Color: Sets the color of the count text.
  • Typography: Opens the full set of font controls for the count text.

Icon

This styles the icons themselves (the reply, retweet, and like/heart icons).

  • Icon Color: Sets the color of all three icons.

X template styling connection

6. Item Box ​

This is a very important section. The Item Box is the entire container or "card" that holds each individual tweet. These settings control the design of that main box.

  • Background Color: This sets the background color for the entire tweet card. By default, it's usually white or transparent, but you can set it to a light gray or any other color to match your brand.
  • Padding: This is the "breathing room" inside the post card. It's the empty space between the card's border and the content inside it (like the author's name and the post text). You can set the padding (in pixels) for the Top, Right, Bottom, and Left sides individually to get the spacing perfect.
  • Border Type: This lets you choose the style of the border for the post card (e..g., Solid, Dotted, Dashed, or None).
  • Width: This setting (which appears if you select a Border Type) lets you control the thickness of the border. You can set the thickness (in pixels) for the Top, Right, Bottom, and Left sides individually.
  • Color: This opens a color picker to set the color of the border itself.

X template styling connection


Connection Settings ​

The Connection tab is a simple shortcut. It allows you to connect a new X (Twitter) Account right from within the template editor.

This is very useful if you are building a template and realize you want to include an account you haven't connected yet, or if you want to add multiple accounts to a single feed.

Please Note: The steps to connect an account here are identical to the main X (Twitter) connection process.

X template styling connection

For a complete, step-by-step guide on how to use these settings, please see our main X (Twitter) Configuration documentation.

Released under the MIT License.