Matthew A PriceIntroducing a new tool! This site lets you create a snippet that you can embed or give to someone else to display your blog articles outside of your site. I built this as there are some hosted shopping cart solutions where you cannot run PHP, and you cannot style elements in an iFrame not from your own site. It would be great to use WordPress' great blogging capability and have the posts automatically fed to your shopping cart or other site. By creating WordPressFeeder.com, I got around both of these issues. The generated code creates stylable elements on your external site. Here is a simple demo of this in action view demo Here is a list of sites currently using this tool: TalkTools - Blog Box
MSI International - The MSI Blog Box
Nutrivita Supplements - Latest News Box
Hope International - Blog Box
BCRC - BCRC Blog Box
Fiesta Pinata - Blog Box
Murphy's Clan - Network News Box
Funky PLanet Co - Blog Feed Box
Feel free to let me know any suggestions, feature requests, or issues you may have with this by commenting on this post. The first step is to simply put in a link to your feed (example feeds are on the site) and choose from the following options:
- Article content character limit
- You can choose what you want your article titles to be wrapped in: h1 ,h2, span, div, etc
- How many posts do you want to show
- Read more link customization. You can pick from up to 9 options
- and...Whether or not you want to display The Post Thumbnail
In order to use the post thumbnail (this assumes that your theme has them enabled), you need to add a function (provided on www.wordpressfeeder.com) to your theme's functions.php as the_post_thumbnail() is not natively included by WordPress' RSS Feeds. Once you generate the code, you get some javascript, css, and html to use. The javascript goes either in your htmlor in a scripts.js file for your site. Note: this code requires jQuery right now. Hopefully i will have an option soon to support other javascript frameworks and possibly framework independent. But for now, it is only jQuery. All you have to place in your html is: "" The javascript dynamically fills the
- with
- s for the number of posts you selected. Every item in the
- gets wrapped in an element for easy styling with CSS. Here is the standard CSS you can use with it:
.wordpress-feeder { } // the main ul that contains the feed .wordpress-feeder li { } // this is the container for each article .wordpress-feeder li h2 { } // this will be what you chose on the options page .wordpress-feeder li .pubdate { } // this is the container for the post date .wordpress-feeder li .description { } // this is the container for the article text .wordpress-feeder li .image { } // this is the container for the image. // there is currently no customization for the date, so if you dont' want to use it, just "display:none;" on that element
^