Skip to content

Get our WordPress Plugins . Feed Them Social . Unlimited websites for $199.00

SlickRemix
  • Products
    • All Access Pass
    • Feed Them Social
      • FTS Premium
      • FTS Combined Streams
      • FTS Facebook Reviews
      • FTS Carousel Premium
    • Hide WooCommerce Products & Categories
  • Demos
    • Feed Them Social
  • Support
    • FAQS
    • Documentation
      • FT Social 4.0+
      • FTS Legacy
      • Feed Them Gallery
    • Create Support Ticket
  • News
  • Checkout
  • My Account
Popular Search installactivatesystem infoshortcodesyste,

Feed Them Social

  • Installing and Activating
  • Creating a Social Feed
  • Add Feed to a Page, Post or Widget
  • Shortcode Location
  • Convert Old Shortcode
  • Create YouTube API Key
  • Feeds Cache
  • System Info Page
  • Translating the Plugin

Feed Them Social Settings

  • General Settings
  • Styles & Scripts
  • Social Sharing
  • CSS: Responsive Grid
  • CSS: Instagram Header
  • CSS: Facebook Photos
  • JavaScript: Grid in Tabs

Feed Them Social Extenstions

  • Installing Paid Extensions
  • Activating Extension License
  • Comparing Premium and Combined Extensions
  • Home
  • Documentation
  • Feed Them Social
  • Feed Them Social Settings
  • CSS: Responsive Grid

CSS: Responsive Grid

This css will give you 3 posts on a row that are fully responsive. When the browser gets to around 960px in width it will give you 2 posts in a row, and when it goes below 640px it will show the posts 1 in a row, which usually happens on mobile devices or small widgets. You can of course adjust the values below or add some to make it work for you.

This will work for the Facebook Feed Grid, Twitter Grid or Combined Feed format.

The first thing you want to do is remove the value for colm_width= and spacing_between_posts= values in your shortcode. Leave the attributes, just remove the values. ie* … grid=yes space_between_posts= colmn_width= …
Add the CSS below the photo to the Custom CSS box on the Settings page of our plugin.

 

.fts-slicker-facebook-posts, .fts-slicker-twitter-posts {
width:100% !important;
}
@media screen and (min-width:640px) {
.fts-jal-single-fb-post, .fts-tweeter-wrap {
width: calc(50% - 10px) !important;
margin:5px !important;
}
}
@media screen and (min-width:960px) {
/* 33.3333% is 3 posts in a row. -10px is the total margin from left to right we subtract considering we want a margin of 5px of spacing below
If you wanted 4 columns it would be 25% and so on */
.fts-jal-single-fb-post, .fts-tweeter-wrap {
width: calc(33.333% - 10px) !important;
/* margin 5px totals 10px if you add the left and right side that is why we do -10px above. */
margin:5px !important;
}
}
This will work for the Combined Streams Grid.
.fts-mashup {
width:100% !important;
}
@media screen and (min-width:640px) {
.fts-mashup-post-wrap {
width: calc(50% - 10px) !important;
margin:5px !important;
}
}
@media screen and (min-width:960px) {
/* 33.3333% is 3 posts in a row. -10px is the total margin from left to right we subtract considering we want a margin of 5px of spacing below
If you wanted 4 columns it would be 25% and so on */
.fts-mashup-post-wrap {
width: calc(33.333% - 10px) !important;
/* margin 5px totals 10px if you add the left and right side that is why we do -10px above. */
margin:5px !important;
}
}

See Example of Responsive grid format.

What are your Feelings
Share This Article :
  • Facebook
  • Twitter
  • LinkedIn
  • Pinterest
Still stuck? How can we help?

How can we help?

Updated on January 30, 2023
Social SharingCSS: Instagram Header

All our Extensions on Unlimited Sites for $199

Software License and Support are good for 1 year from the date of purchase.

All Access Pass

About SlickRemix

SlickRemix has been simplifying your daily life with our WordPress plugins for over 10 years. We take pride in creating software that can help accomplish your goals so you can spend less time at your computer and more time living life.

From creating galleries to selling Images & making your social media presence visible we've got you covered. We offer 30 Day Money Back Guarantee and support 5 days a week from our knowledgeable team. You can take comfort that we'll be there to assist in the best and most professional way possible when you need it.

Feed Them Social

  • View Examples
  • Documentation
  • Free Download

News & Updates

As of Monday February 20th, 2023 the 4.0.0 version of Feed Them Social has been launched. Click here if you are having trouble and need to convert your shortcode.

Regretfully Feed Them Gallery is being removed from our store because it did not gain the traction we had hoped for. We will support current premium users of the plugin until August of 2023.

Payments

Use your Credit Card or PayPal Account to make payments on our site through our safe & secure checkout process. We will never store your Credit Card information or sell your contact info to 3rd parties, because that's just not cool.

Do you need help?

If you can't find the answers you are looking for we would be glad to help point you in the right direction. If you are an existing user you can login to your account and submit a support ticket for help or refunds.

If you have a presale question or you are using one of our Free plugins, you can use the Sales bubble in the lower right corner of our site.

© 2023 SlickRemix . Refunds . Terms . Privacy Policy