Post Carousel

Post Carousel

How to Configure & Style EA Post Carousel

EA Post Carousel gives you the opportunity to add transition effects on how the Post carousel will appear and make it absolutely breathtaking for your landing page.

Table of Contents:

  1. How to Activate Post Carousel
  2. How to Configure the Content Settings
    2.1. Query
    2.2. Layout Settings
    2.3. Carousel Settings
  3. How to Style Post Carousel
    3.1. Post Style
    3.2. Others
  4. Final Outcome

1. How to Activate Post Carousel

To use this Essential Addons element, find the EA Post Carouselelement from the Search option under the ELEMENTS tab. Simply just Drag & Drop the EA Post Carousel’ into the Drag widget hereor the ‘+’ section.

Post Carousel

After you are successfully done with this step, this is how the element is going to look like.

Post Carousel

2. How to Configure the Content Settings

Under the ‘Content’ tab, you will be able to configure ‘Query’, ‘Layout Settings’ & ‘Carousel Settings’.

2.1. Query

From this section, you can choose the ‘Source’ of your query from where the contents will be retrieved and displayed. You can use the drop-down to select one of these as your source: Posts, Pages, WooCommerce Products & Manual Selection.

After choosing your preferred ‘Source’, you can filter your contents by ‘Author’, ‘Categories’ & ‘Tags’. You have the flexibility to choose multiple options and add as many authors, categories & tags as you wish. If you do not want certain posts to appear, you can simply ‘Exclude’ those contents as well.

Moreover, you can set the number of ‘Posts Per Page’ and changes its ‘Order By’ option as well.

Post Carousel

2.2. Layout Settings

From the ‘Layout Settings’, you have the flexibility to use the toggle to hide or display ‘Image’, ‘Title’, ‘Excerpt’ & ‘Meta’. If you wish to show an image for the carousel, you can adjust the image size.

Similarly, if you toggle on the show except for your posts in the carousel, you will be able to set the limit of excerpt words from here. If enabled, you can change the position of ‘Meta’ as well.

Post Carousel

2.3. Carousel Settings

You have the freedom to choose your preferred ‘Transition Effect’ from the ‘Effect’ dropdown menu: Slide, Fade, Cube, Coverflow & Flip. Besides, you can modify the ‘Visible Items’, ‘Items Gap’ & ‘Image Height’.

Use the toggle to enable/disable the ‘Autoplay’ option. If it’s turned on, you are able to change the speed as well. If you wish, you can even turn off/on toggles for these following options : ‘Pause on Hover’, ‘Infinite Loop’ & ‘Grab Cursor’. On the other hand, ‘Navigation’ section allows to add Arrows or Dots or both for your Carousel layout.

Post Carousel

3.  How to Style Post Carousel

Switch to the ‘Style’ tab to style all the features of Post Carousel and get your desired result.

3.1. Post Style

From the ‘Post Style’ section, you are able to change the ‘Post Hover Icon’, ‘Post Background Color’ & ‘Thumbnail Overlay Color’. You can use the dropdown menu to choose your preferred ‘Hover Style’ as well. Besides, you can also add Box Shadow & add ‘Border’ styling.

Post Carousel

3.2. Others

From the ‘Color & Typography’ tab, you can easily change alignment, color & typography of ‘Title’, ‘Meta’ & ‘Excerpt’ style. Besides, you can easily add styling to the navigation icons from ‘Arrows’ & ‘Dots’ sections.

Post Carousel

4. Final Outcome

By following the basic steps and a bit more modifying, you can style your Post Carousel content as per your preference.

Post Carousel

This is how you can make an amazing looking Carousel styled content showcase using EA Post Carousel.

Getting stuck? Feel to Contact Our Support for further assistance.

Get Started Now

Content Ticker

Content Ticker

How to Configure EA Content Ticker

If you are looking for a way to display ‘breaking news’, ‘Special Offers’ or anything newsworthy, you should definitely implement a Content Ticker on your website.

EA Content Ticker helps you to design a beautiful ticker and gives you the freedom to display ‘Dynamic’ or ‘Custom’ contents as your headlines.

Besides, EA Content Ticker also gives you the flexibility to add nice transition effects & add personalized styling to all the features. Thanks to this Essential Addons element, you can now put the focus on the ‘Headline’ of your contents & make it totally eye-catching to your site visitors.

Table of Contents:

  1. How to Activate Content Ticker
  2. How to Configure the Content Settings
    2.1. Ticker Settings
    2.2. Dynamic Content Settings
    2.3. Custom Content Settings
    2.4. Animation Settings
  3. How to Style Content Ticker
    3.1. Content Style
    3.2. Others
  4. Final Outcome

1. How to Activate Content Ticker

Find the EA Content Tickerelement from the Search option under the ELEMENTS tab. Simply just Drag & Drop the EA Content Ticker’ into the Drag widget hereor the ‘+’ section.

Content Ticker

After you are successfully done with this step, this is how the element is going to look like.

Content Ticker

2. How to Configure the Content Settings

Under the ‘Content’ tab, you will find the settings for your Ticker, Content & Animation. You can easily configure your preferred options from this section.

2.1. Ticker Settings

You can use the dropdown menu to choose a ‘Ticker Type’. You can either select ‘Dynamic’ or ‘Custom’ Ticker type. You will be able to configure the ‘Ticker’ based on your chosen type. Besides, you can also change the headline of your Content Ticker by modifying the ‘Tag Text’ field.

Content Ticker

2.2 Dynamic Content Settings

With Dynamic Content, you can choose a source from which your contents will be generated. You can select any of these 3 as your source: Posts, Pages or Manual Selection.

After doing so, you have the flexibility to show only certain posts based on the tags, authors & categories. If you want, you can even exclude certain posts or pages as well.

Besides, you can set the number of contents which you want to display on your Content Ticker as well. You can also sort out the contents as well by modifying ‘Order’ & ‘Order By’ options.

Content Ticker

2.3 Custom Content Settings

With Custom Content, you can easily insert your own contents and insert a link to them if you wish to. When you move the mouse over the content, you will be able to view the link. Simply click on ‘+ Add Item’ button to insert more custom contents.

Content Ticker

2.4 Animation Settings

From the ‘Animation Settings’, you can the transition effect on how the contents will be displayed on your site. By default, it is set to the ‘Slide’ effect.

Besides, you can use the toggle to enable or disable ‘Autoplay’, ‘Pause on Hover’, ‘Infinite Loop’, ‘Grab Cursor Icon’ & ‘Arrows’. You can modify the speed of your Slider transition & Autoplay as well. Use the dropdown menu right at the bottom to change the direction of your effect.

Content Ticker

Click to See Live Demo

3.  How to Style Content Ticker

Switch to the ‘Style’ tab to style all the features of Content Ticker and get your desired result.

3.1. Content Style

From the ‘Ticker Content’ section, you can modify the color of your Content Ticker background & text. You can add styling to the typography as well.

Content Ticker

3.2. Others

You can add more styling to the EA Content Ticker by modifying ‘Tag Style’ & ‘Arrows’. You can change the color, typography & background of your headline by modifying ‘Tag Style’.

From the ‘Arrows’ section, you can easily change the alignment, size, and icon of your Arrows. You can add styling to ‘Border’ & ‘Color’ of Arrows as well.

Content Ticker

4. Final Outcome

By following the basic steps and a bit more modifying, you can style your Content Ticker as per your preference.

Content Ticker

This is how you can easily highlight important announcement & make the headlines very appealing to your visitors by EA Content Ticker.

Getting stuck? Feel to Contact Our Support for further assistance.

Get Started Now

Post Grid

Post Grid

How to Configure & Style EA Post Grid

EA Post Grid places multiple post/blogs in an aesthetic post grid. The purpose of this element is to let you organize and place your posts in one place. With the help of it, you can nicely display the listing of your blog posts.

Table of Contents:

  1. How to Activate Post Grid
  2. How to Configure the Content Settings
    2.1. Query
    2.2. Layout Settings
  3. How to Style Post Grid
    3.1. Post Grid Style
    3.2. Others
  4. Final Outcome

1. How to Activate Post Grid

To use this Essential Addons element, find the EA Post Gridelement from the Search option under the ELEMENTS tab. Simply just Drag & Drop the EA Post Grid’ into the Drag widget hereor the ‘+’ section.

Post Grid

After you are successfully done with this step, this is how the element is going to look like.

Post Grid

2. How to Configure the Content Settings

Under the ‘Content’ tab, you will be able to configure ‘Query’ & ‘Layout Settings’.

2.1. Query

From this section, you can choose the ‘Source’ of your query from where the contents will be retrieved and displayed. You can use the drop-down to select one of these as your source: Posts, Pages, WooCommerce Products & Manual Selection.

After choosing your preferred ‘Source’, you can filter your contents by ‘Author’, ‘Categories’ & ‘Tags’. You have the flexibility to choose multiple options and add as many authors, categories & tags as you wish. If you do not want certain posts to appear, you can simply ‘Exclude’ those contents as well.

Moreover, you can set the number of ‘Posts Per Page’ and changes its ‘Order By’ option as well. Simply use the order option to pick an ascending or descending layout for the posts.

Post Grid

Click to See Live Demo

2.2. Layout Settings

You can change the layout of EA Post Grid from this section. Assign the number of columns in which your blogs will be displayed. You can have a maximum of 6 columns for the grid. You can set the ‘Image Size’ as well.

Besides, you can use the toggle to hide or display ‘Load More Button’, ‘Image’, ‘Title’, ‘Excerpt’ & ‘Meta’. If ‘Excerpt’ option is enabled, you will able to set the limit of excerpt words. You can change the position of ‘Meta’ as well.

Post Grid

3.  How to Style Post Grid

Switch to the ‘Style’ tab to style all the features of Post Grid and get your desired result.

3.1. Post Grid Style

From the ‘Post Grid Style’ section, you can set a ‘Background Color’ for your Post Grid. You are able to change the ‘Spacing Between Items’ from here. Besides, you can also add Box Shadow & add ‘Border’ styling.

Post Grid

3.2. Others

From the ‘Color & Typography’ settings, you can adjust the Title style, Excerpt style, and Meta style separately. On the other hand, ‘Hover Card Style’ lets you add an animation on how your hover transition will appear when you move your mouse over a post. Besides, you can change the ‘Hover Icon’ and add styling to it as well.

Post Grid

You can adjust the Background & Text Color of the button both when it’s in a normal view or a when mouse is hovered over it from ‘Load More Button Style’ section. You are also able to easily customize the ‘Load More Button’ by adding Border, Box Shadow & changing its typography.

Post Grid

4. Final Outcome

By following the basic steps and a bit more modifying, you can style your Post Grid as per your preference.

Post Grid

This is how you can easily showcase your blog posts with an attractive & interactive layout using EA Post Grid.

Getting stuck? Feel to Contact Our Support for further assistance.

Get Started Now