CODEWITHSUNDEEP
javascripthtmlcssrssgoogle-feed-api
Duncan
Duncan

Reputation: 1

Google Feed Control - Styling with CSS

I'm putting together a small list of RSS feeds using the Google Dynamic Feed Control.

However I'm just wondering if there is any documentation into explaining how I could style it. As I'm aware it uses it's own pre-set styling e.g. .gfc-title {} , .gfc-resultsHeader {} These are the only two I'm aware of.

I have just four feeds I'm pulling in, and I really want to organize them into a vertical column next to one another. Rather than the default stacked, left aligned on top of one another.

Apologies if I'm missing something obvious here!

      <script type="text/javascript" src="https://www.google.com/jsapi"></script>
            <script type="text/javascript">
       google.load("feeds", "1");

       function OnLoad() {
       // Create a feed control
       var feedControl = new google.feeds.FeedControl();

      // Add two feeds.
      feedControl.addFeed("#", "Feed 1");
      feedControl.addFeed("#", "Feed 2");
      feedControl.addFeed("#", "Feed 3");
      feedControl.addFeed("#,  "Feed 4");


      // Draw it.
      feedControl.draw(document.getElementById("google_feeds"));
      }

      google.setOnLoadCallback(OnLoad);

Upvotes: 0

Views: 560

Answers (1)

janih
janih

Reputation: 2234

You could use the developer tools of your browser to find out the CSS classes of Google's feed control. I guess the most important ones are gfc-resultsRoot, gfc-resultsHeader, gfc-title, gfc-results and gfc-result

You probably get the result you want by adding styles to gfc-resultsRoot. Maybe something like this: http://jsfiddle.net/qy81yn7f/1/

.gfc-resultsRoot { 
  width: 300px;
  float: left;
}

Upvotes: 0

Related Questions