WordPress - Issues with CDATA and unwanted tags appearing in the feed content.

There is an issue with WordPress RSS whereby unwanted tags can occur in feed content. These look something like this example where a paragraph <p> tag has appeared:


Latest Hollywood Gossip

<p>Justin Beeber was today present at the "Terrible Music Awards" in San Francisco where he received the Gold Award for the most terrible music of the decade so far....more>>

11/10/2015 09:00 UDT


 The entries look like this:

<![CDATA[ JavaScript.js here...

and close with 

]]

Some of your FeedWind code may be enclosed by such CDATA tags.

The FeedWind code does not edit these CDATA sections so feed content items which are enclosed in CDATA are not edited/affected at all - we display this content verbatim. This is a normal way to handle CDATA content. To resolve the problem, you can remove the CDATA tags in your WordPress page/post editor.

Background info: If you are wondering where the tags came from, the WordPress editor adds CDATA tags around any JavaScript (JS) it finds (a normal programming practice when encapsulating JS for an XHTML page) but only when you switch from the "text" view, to the "visual" view using the WordPress editor and then save the post/page. 

Solution: To stop this happening, when you finish editing in the visual editor, revert to the "text" editor (the tabs just along the right side of the toolbar when you are editing a page/post). Remove any CDATA start/end tags and save the page/post while the tex editor is still in use. This prevents WordPress from adding CDATA tags.

There is no other way around this that we are ;aware of and a source of common problems for us (as we use JS too) and WordPress users in general. see https://wordpress.org/support/topic/why-is-the-editor-adding for some further information.
Applying this solution should resolve the issue of the <p> and other tags displaying in your feeds. If you run into difficulty, contact FeedWind support for assistance.



The General section of the FeedWind setup screen contains options controlling the colors and text length of your RSS feed content. One of the more important features is the HTML Tag option which affects the content type shown in the widget.


The HTML Tag in the FeedWind RSS widget

Many HTML tags can be included in RSS so feeds can look very different and contain almost any type of media - the range includes video, images, audio podcasts, static and dynamic (scrolling) text and hyperlinks. Most HTML elements can be included in an RSS feed depending on needs of the feed creator/programmer and their anticipated users. Although this makes RSS very versatile, it can make the feed content unpredictable in size and shape.




Content can be displayed as per the examples below:


Text Only

RSS Feed Widget

Text & Thumbnail

RSS Feed Widget

Full HTML

RSS Feed Widget


Google Webfonts can be used in the FeedWind widget - Here is how:

To create an RSS widget that uses Google Webfonts you will need to create a custom CSS. This is not as difficult as you may think and is mainly a copy/paste exercise. The following steps need to be taken to implement Webfonts for one or more of your widgets:

  1. 1. Create a custom CSS for your widget (see instructions at Custom CSS with FeedWind Part 1 of 2 and Custom CSS with FeedWind Part 2 of 2
  2. 2. Choose a Webfont from the list at Google (you can choose more afterwards)
  3. 3. Click the "Quick Use" icon to the Left of the [Add to Collection] button of a font you want to add
  4. 4. Choose the styles/character set you want to include in the upper sections 1 & 2
  5. 5. Select the @import tab in section 3
  6. 6. Copy the line you see, it will be similar to: @import url(http://fonts.googleapis.com/css...);
  7. 7. Paste the line from no.6 above to the very top of your custom CSS file on a fresh line.
  8. 8. Edit the "font-family" settings in the custom CSS for whichever elements you want the webfont to appear.
  9. 9. Save your CSS file.
When you put the widget HTML into a web page now, the target browser will check out your custom CSS, look up the font at Google and integrate it into the style of your widget.

Note: Settings made in the custom.css will override settings from the FeedWind setup screen.


adding RSS feeds See this example (pictured right>) which uses a single webfont throughout: (Montez)

Multiple Webfonts can be applied by adding extra '@import' values (see item 6 above) to the top of the custom CSS and applying the attributes in the Custom CSS.


This is the Custom CSS file I used with 2 webfonts loaded: Chewy & Lato

/* Container */

@import url(http://fonts.googleapis.com/css?family=Lato:300);

@import url(http://fonts.googleapis.com/css?family=Chewy);

#container {margin:0; padding:0; width:500px; height:250px; font-size:12px; font-color:#e5fdff; border-style:solid; border-color: red; border-radius: 3px; border-width: 0px; background-color:#ffffff;}

/*Header*/

#header {width:450px;height:10px;margin:0px 0px 10px 0;padding:10px 5px 10px 5px;font-color:#0284fe;}

#header .feed_title{margin:2px 0px 50px 0;padding:2px 5px 50px 5px;font-family: Chewy ;font-weight:bold;font-size:large ;}

#header .feed_title a:link{color:#0284fe;text-decoration:bold;}

#header .feed_title a:visited{color:#202020;text-decoration:none;}

#header .feed_title a:hover{color:#00f0ed ;text-decoration:underline;}

#header .feed_title a:active{color:#800000;text-decoration:none;}

/*Content*/

#content {margin:0;padding:5px 5px 10px 10px;}

#content .feed_item{margin:1em 1em 1em 1em ;padding:1em 1em 1em 1em;font-family: Lato; font-weight:light;}

#content .feed_item_title{margin:1px 20px 1px 3px;padding:1px 0 1px 3px;color:#Green;font-weight:bold;}

#content .feed_item_title a:link{color:##0284fe;text-decoration:none;}/*feed_item_title:link*/

#content .feed_item_title a:visited{color:#202020;text-decoration:none;}/*feed_item_title:visited*/

#content .feed_item_title a:hover{color:#cyan;text-decoration:underline;}/*feed_item_title:hover*/

#content .feed_item_title a:active{color:#800000;text-decoration:none;}/*feed_item_title:active*/

#content .feed_item_description{margin:0 0 0 3px;padding:0 0 0 3px;color:#0284fe;line-height:135%;}



Hide/display feed item titles and content

FeedWind offers the option to hide or display feed content titles and items so users can customize their feed content. In some cases such as with Facebook feeds, feed items can contain a duplicated title in the content. This features allows users to remove that duplicated title and enable/disable links in feed items.

rss feed content and title display & linking

The added option to include the source URL (rather than the URL of each feed item link) allows even more possibilities. There are numerous configurations now possible when these options are chosen. To help you understand the differences we have compiled a table which contains the various settings and a display of the results;


Display Content >

Both

Title Only

Content Only

Link >

off

off

off


Display Content >

Both

Title Only

Content Only

Link >

on

on

on



FeedWind has a filtering system which allows users to include and exclude content depending on the keywords they specify. Multiple keywords can be used with the include and exclude filter, separated by semicolons. A keyword can contain more than one word, so phrases can also be used as well as single words. The filters are found in the FeedWind setup screen in the Advanced settings section of the "General" section, as seen in the example below. As FeedWind supports multiple feeds, this filtering mechanism in combination with feed aggregation offers users powerful options when it comes to creating an RSS feed widget.

reverse text rss widget



Embedding an RSS feed is really a straightforward process that anyone who can copy/paste should be able to manage. Most web pages are coded in HTML or PHP with JavaScript and CSS which to many might seem a bridge too far when it comes to embedding code such as the FeedWind RSS widget. Fortunately you don't need to know anything much about those languages because although the FeedWind code is a combination of CSS/HTML and Script, all you need to know is how to copy and paste it. Importantly, you need to know where to paste your widget HTML.

EMBED WIDGET IN WEB PAGE

A web page built in code such as PHP and HTML can include a widget simply by copying the code snippet to the page where you want it to appear. This is usually enclosed in a container such as a <div> or an <iFrame>, either of which work well with Feedwind.

Embedding a Widget in popular CMS systems

Many CMS and site builders use a type of editor that allows for HTML code and for regular text/content in seperate views.

The following examples of popular CMS have dual (formatted text/wysiwyg & HTML) editors for Posts/Pages.

These have two general editor views when you are editing a post/page.

1) WYSIWYG/Formatted view

2) HTML/Code view

The WYSIWYG view is what most people see; a representation of the page/post showing images, text and formatting (such as text size, alignment etc.). This view has no coding visible. The HTML/code view however has all the HTML/CSS etc available to view and edit. This is where the embedded RSS feed code will be placed. For those unfamiliar with the HTML/Code view, it can seem a little daunting and you would be right in guessing that just a single character deleted from the code here can make a page unusable, or a mess to look at at best.

Unfortunately, many of these editors do not even lay the code out for you to easily read it and locate the spot where you want your widget to appear. There is a trick to doing this however that will save you a lot of peering at your screen as you try to navigate what can be a large block of mostly incomprehensible text.

1 - First create your FeedWind widget at the FeedWind setup page and CTRL+C (Copy) the HTML available there.

2 - Then, view page/post where you want to embed your RSS feed in Normal view mode, where you can see images etc.

3 - Scroll to wherever you want your widget to appear and enter a block of characters that can easily be seen - something like: XXXXX

4 - Then open the HTML/code editor view and click your cursor to the top of the window containing the code+page content. Then use CTRL+F (or whatever "find" is in your browser) and search for XXXXX

5 - The browser should highlight that. Use your mouse to make sure the XXXXX is highlighted and use CTRL+V to paste the HTML from FeedWind.

This will place the widget wherever the marker was put. The only reason to use this method is to easily locate your placement on a page - even if you are experienced at coding, this might save you time. 
 

EMBED RSS WIDGET IN SIDEBAR

Embedding the FeedWind RSS widget into a WordPress SideBar

To embed a widget in a sidebar, there are different methods depending on the platform. WordPress is the easiest. When you open the Widgets in the dashboard, you are given the option of numerous widget types. To embed your RSS feed into a WordPress sidebar, simply drag an empty text widget into the sidebar you want to display it in, then paste your HTML code from the FeedWind Setup page into the text widget. If you want, you can also copy it and add it to an existing text widget. Just make sure the dimensions of the widget you made will fit in the sidebar.

Embedding the FeedWind RSS widget into a Joomla SideBar

Joomla treats sidebars as modules. These have a management section separate to the page/post/article editors in Joomla but essentially they have the same approach as a page/post/article because they share the same editor. This means that the same principle can be applied as with embedding into a page/post as described above.

Embedding the FeedWind RSS widget into a Drupal SideBar

This is essentially the same process as with Joomla. The same editor as the posts/pages editor is used to create content for sidebars.

Check Your Code

Most other CMS (Content Management System) have a similar structure to either Joomla or WordPress and allow the HTML from FeedWind to be pasted anywhere that  supports HTML. Users must be aware that some CMS will "adjust" the HTML you put in. This can take various forms such as treating the code as a CDATA entry (common in WordPress). In this case the CDATA open/closing entry must be deleted. Other CMS might create a <div> (which is ok), or add/encapsulate your widget in other code. If your widget does not display, the first port of call is to check the code again. Removed line breaks are not usually a problem, but code that is added or removed by the CMS can stop FeedWind from working properly.

RSS Feed Widget


In many cases it is convenient for users to add together RSS feeds so we have included this feature in the FeedWind RSS widget. Its really easy to use;

Simply paste your feed URL into the FeedWind setup screen, and click on the [Add Feeds] button then repeat the exercise until all your feeds have been added. The on-screen Preview will update in real time so in just a few minutes you can generate an aggregated feed of all your favorite RSS feeds added together. We made the process as simple as possible to help smooth the process of creating a single feed from multiple RSS URLs!

adding RSS feeds
RSS Feed Widget

This can be repeated for multiple feeds which will be listed directly below the entry field. The real-time preview will update accordingly so you can see the sequence of the feed items. This easy-to-use RSS feed aggregation allows you to quickly create an RSS display widget that contains information from different sources and sites. This improves the quality and variety of information you can make available.

Because we offer autoscrolling and various sorting options too, you can really make the most of the page space you have available on your websites.

Note: Adding more than 10 feeds together can make your page loading very slow and it can also cause the widget not to display properly. This is because for every feed URL you add, our server has to poll other servers to get the feed content from them. This can cause our server to timeout where responses are slow and ultlimately cause problems.

Make your site the 'go-to' place when it comes to the best information available on any topic by using FeedWind aggregated feed widgets.



With FeedWind you are in complete control of the title of your feed(s). With just a few adjustments you can alter the feed title for your RSS feed container and change the link address too. This allows you to offer a n alternative to the title link that is contained in the RSS feed you are using.

You can also disable the link altogether and have a simple text title (or none at all if you prefer!) The backgrounds and font colors for your widget can be changed too in the advanced Settings section (see image below).

There are several available settings:

Item Settings    
Feed Title display:   On Off
Feed Title Text: From Feed User-defined None
Feed TItle URL: From Feed User-defined None
Feed Title Background: Color Selector User-defined None


These settings are made in the Feed Title section of the FeedWind Setup screen as follows:



FeedWind now features a reverse text direction control in the FeedWind setup screen. This new feature allows users the option to display reverse text languages in their RSS feed widget. There are a number of languages which require right to left text functionality - Wikipedia has a list of reverse-text languages and further information on the topic.

To use the feature in the setup screen, simply click on the General >Advanced Settings section and select the text direction that you would like to use. Make sure you also check the text alignment to align the text correctly relating to the chosen text direction. If you use Right-to-Left then text needs to be aligned right or justified - For Left-to-Right text, alignment should be set to left or justified.


reverse text rss widget


Advanced Users

There is no need to create any custom CSS to reverse the text direction in your RSS feed widget but advanced users might like to use CSS to create a more specialized feed with combinations of right-to-left and left-to-right text possible. You can set the text direction for individual RSS feed components with a custom CSS - see our reverse-text with CSS tutorial here).



rss widget problem with IE8Some users have reported problems related to IE8. We recommend comparing your widget code that you copied, to that which the page has when published (hover over the widget, right click and "examine object" or a similar menu item) will all you to open the console (or pres F12) and see that page's HTML. Another method is to visit the page then save the page from your browser then view it in a HTML reader. or open it in notepad.

If this part of the code displays line the following on your live page the FeedWind RSS widget will not work.The code in red is incorrect:

rssmikle_item_podcast="off";
//</script>

<br />
--&gt;

<script src="http://widget.feed.mikle.com/js/rssmikle.js"
type="text/javascript"></script>



The FeedWind RSS widget now has a Time Zone feature so that your feed entries display the time in your local Time Zone. When the Time/Date feature is switched to "On", the time/date of each entry is displayed below each feed content item. There are settings available for different time and date formats and for different TimeZones. The date/time feature can also be switched off altogether.

rss feed timezone feature



The FeedWind RSS widget has a sort feature to allow feed items to be displayed in a predefined sort order. Its really easy to set up and only takes a click or two to implement. The sort feature has three options and can be found in the setup screen at FeedWind in the General section >Advanced Settings. The sort options are:

  1. Newest - The newest feed item appears at the top
  2. Oldest - The oldest feed item appears at the top
  3. Random - The sort order for the feed is randomized
  4. Off - The sort order is controlled by the incoming feed XML

Placing the newest at the top helps you maintain the most current feed item in view to keep your page up to date. If your RSS feed has many entries, using autoscroll can help get the whole feed into view without having to create a large widget and use up a lot of screenspace. For feeds that are not date sensitive, a random sort is a good solution.

sorted rss widget



There are two types of Facebook RSS feeds; the first is a timeline RSS feed, the second is a notifications RSS feed.

Facebook posts RSS feed

This URL for example gives you a feed from our own facebook page but you can replace the red with your own ID to create your own custom RSS newsfeed from Facebook.

https://www.facebook.com/feeds/page.php?id=605201699542822&format=RSS20

To get the best results you can open the >Advanced section of the FeedWind setup screen where you can switch the HTML tag to "On" which will enable things like videos and images to be displayed as clickable thumbnails.

Here is an example using our own Facebook page.

RSS Feed Widget

Facebook notifications RSS feed

To get Facebook notifications only in your Facebook RSS feed, you can log into your facebook account, then go to https://www.facebook.com/notifications and you will see:

Get notifications via: RSS

 

Right-click on the RSS link and copy the link address - this is the URL you will put into the FeedWind setup page.








































WordPress - Issues with CDATA and unwanted tags appearing in the feed content.

There is an issue with WordPress RSS whereby unwanted tags can occur in feed content. These look something like this example where a paragraph <p> tag has appeared:


Latest Hollywood Gossip

<p>Justin Beeber was today present at the "Terrible Music Awards" in San Francisco where he received the Gold Award for the most terrible music of the decade so far....more>>

11/10/2015 09:00 UDT


 The entries look like this:

<![CDATA[ JavaScript.js here...

and close with 

]]

Some of your FeedWind code may be enclosed by such CDATA tags.

The FeedWind code does not edit these CDATA sections so feed content items which are enclosed in CDATA are not edited/affected at all - we display this content verbatim. This is a normal way to handle CDATA content. To resolve the problem, you can remove the CDATA tags in your WordPress page/post editor.

Background info: If you are wondering where the tags came from, the WordPress editor adds CDATA tags around any JavaScript (JS) it finds (a normal programming practice when encapsulating JS for an XHTML page) but only when you switch from the "text" view, to the "visual" view using the WordPress editor and then save the post/page. 

Solution: To stop this happening, when you finish editing in the visual editor, revert to the "text" editor (the tabs just along the right side of the toolbar when you are editing a page/post). Remove any CDATA start/end tags and save the page/post while the tex editor is still in use. This prevents WordPress from adding CDATA tags.

There is no other way around this that we are ;aware of and a source of common problems for us (as we use JS too) and WordPress users in general. see https://wordpress.org/support/topic/why-is-the-editor-adding for some further information.
Applying this solution should resolve the issue of the <p> and other tags displaying in your feeds. If you run into difficulty, contact FeedWind support for assistance.



The General section of the FeedWind setup screen contains options controlling the colors and text length of your RSS feed content. One of the more important features is the HTML Tag option which affects the content type shown in the widget.


The HTML Tag in the FeedWind RSS widget

Many HTML tags can be included in RSS so feeds can look very different and contain almost any type of media - the range includes video, images, audio podcasts, static and dynamic (scrolling) text and hyperlinks. Most HTML elements can be included in an RSS feed depending on needs of the feed creator/programmer and their anticipated users. Although this makes RSS very versatile, it can make the feed content unpredictable in size and shape.




Content can be displayed as per the examples below:


Text Only

RSS Feed Widget

Text & Thumbnail

RSS Feed Widget

Full HTML

RSS Feed Widget


Google Webfonts can be used in the FeedWind widget - Here is how:

To create an RSS widget that uses Google Webfonts you will need to create a custom CSS. This is not as difficult as you may think and is mainly a copy/paste exercise. The following steps need to be taken to implement Webfonts for one or more of your widgets:

  1. 1. Create a custom CSS for your widget (see instructions at Custom CSS with FeedWind Part 1 of 2 and Custom CSS with FeedWind Part 2 of 2
  2. 2. Choose a Webfont from the list at Google (you can choose more afterwards)
  3. 3. Click the "Quick Use" icon to the Left of the [Add to Collection] button of a font you want to add
  4. 4. Choose the styles/character set you want to include in the upper sections 1 & 2
  5. 5. Select the @import tab in section 3
  6. 6. Copy the line you see, it will be similar to: @import url(http://fonts.googleapis.com/css...);
  7. 7. Paste the line from no.6 above to the very top of your custom CSS file on a fresh line.
  8. 8. Edit the "font-family" settings in the custom CSS for whichever elements you want the webfont to appear.
  9. 9. Save your CSS file.
When you put the widget HTML into a web page now, the target browser will check out your custom CSS, look up the font at Google and integrate it into the style of your widget.

Note: Settings made in the custom.css will override settings from the FeedWind setup screen.


adding RSS feeds See this example (pictured right>) which uses a single webfont throughout: (Montez)

Multiple Webfonts can be applied by adding extra '@import' values (see item 6 above) to the top of the custom CSS and applying the attributes in the Custom CSS.


This is the Custom CSS file I used with 2 webfonts loaded: Chewy & Lato

/* Container */

@import url(http://fonts.googleapis.com/css?family=Lato:300);

@import url(http://fonts.googleapis.com/css?family=Chewy);

#container {margin:0; padding:0; width:500px; height:250px; font-size:12px; font-color:#e5fdff; border-style:solid; border-color: red; border-radius: 3px; border-width: 0px; background-color:#ffffff;}

/*Header*/

#header {width:450px;height:10px;margin:0px 0px 10px 0;padding:10px 5px 10px 5px;font-color:#0284fe;}

#header .feed_title{margin:2px 0px 50px 0;padding:2px 5px 50px 5px;font-family: Chewy ;font-weight:bold;font-size:large ;}

#header .feed_title a:link{color:#0284fe;text-decoration:bold;}

#header .feed_title a:visited{color:#202020;text-decoration:none;}

#header .feed_title a:hover{color:#00f0ed ;text-decoration:underline;}

#header .feed_title a:active{color:#800000;text-decoration:none;}

/*Content*/

#content {margin:0;padding:5px 5px 10px 10px;}

#content .feed_item{margin:1em 1em 1em 1em ;padding:1em 1em 1em 1em;font-family: Lato; font-weight:light;}

#content .feed_item_title{margin:1px 20px 1px 3px;padding:1px 0 1px 3px;color:#Green;font-weight:bold;}

#content .feed_item_title a:link{color:##0284fe;text-decoration:none;}/*feed_item_title:link*/

#content .feed_item_title a:visited{color:#202020;text-decoration:none;}/*feed_item_title:visited*/

#content .feed_item_title a:hover{color:#cyan;text-decoration:underline;}/*feed_item_title:hover*/

#content .feed_item_title a:active{color:#800000;text-decoration:none;}/*feed_item_title:active*/

#content .feed_item_description{margin:0 0 0 3px;padding:0 0 0 3px;color:#0284fe;line-height:135%;}



Hide/display feed item titles and content

FeedWind offers the option to hide or display feed content titles and items so users can customize their feed content. In some cases such as with Facebook feeds, feed items can contain a duplicated title in the content. This features allows users to remove that duplicated title and enable/disable links in feed items.

rss feed content and title display & linking

The added option to include the source URL (rather than the URL of each feed item link) allows even more possibilities. There are numerous configurations now possible when these options are chosen. To help you understand the differences we have compiled a table which contains the various settings and a display of the results;


Display Content >

Both

Title Only

Content Only

Link >

off

off

off


Display Content >

Both

Title Only

Content Only

Link >

on

on

on



FeedWind has a filtering system which allows users to include and exclude content depending on the keywords they specify. Multiple keywords can be used with the include and exclude filter, separated by semicolons. A keyword can contain more than one word, so phrases can also be used as well as single words. The filters are found in the FeedWind setup screen in the Advanced settings section of the "General" section, as seen in the example below. As FeedWind supports multiple feeds, this filtering mechanism in combination with feed aggregation offers users powerful options when it comes to creating an RSS feed widget.

reverse text rss widget



Embedding an RSS feed is really a straightforward process that anyone who can copy/paste should be able to manage. Most web pages are coded in HTML or PHP with JavaScript and CSS which to many might seem a bridge too far when it comes to embedding code such as the FeedWind RSS widget. Fortunately you don't need to know anything much about those languages because although the FeedWind code is a combination of CSS/HTML and Script, all you need to know is how to copy and paste it. Importantly, you need to know where to paste your widget HTML.

EMBED WIDGET IN WEB PAGE

A web page built in code such as PHP and HTML can include a widget simply by copying the code snippet to the page where you want it to appear. This is usually enclosed in a container such as a <div> or an <iFrame>, either of which work well with Feedwind.

Embedding a Widget in popular CMS systems

Many CMS and site builders use a type of editor that allows for HTML code and for regular text/content in seperate views.

The following examples of popular CMS have dual (formatted text/wysiwyg & HTML) editors for Posts/Pages.

These have two general editor views when you are editing a post/page.

1) WYSIWYG/Formatted view

2) HTML/Code view

The WYSIWYG view is what most people see; a representation of the page/post showing images, text and formatting (such as text size, alignment etc.). This view has no coding visible. The HTML/code view however has all the HTML/CSS etc available to view and edit. This is where the embedded RSS feed code will be placed. For those unfamiliar with the HTML/Code view, it can seem a little daunting and you would be right in guessing that just a single character deleted from the code here can make a page unusable, or a mess to look at at best.

Unfortunately, many of these editors do not even lay the code out for you to easily read it and locate the spot where you want your widget to appear. There is a trick to doing this however that will save you a lot of peering at your screen as you try to navigate what can be a large block of mostly incomprehensible text.

1 - First create your FeedWind widget at the FeedWind setup page and CTRL+C (Copy) the HTML available there.

2 - Then, view page/post where you want to embed your RSS feed in Normal view mode, where you can see images etc.

3 - Scroll to wherever you want your widget to appear and enter a block of characters that can easily be seen - something like: XXXXX

4 - Then open the HTML/code editor view and click your cursor to the top of the window containing the code+page content. Then use CTRL+F (or whatever "find" is in your browser) and search for XXXXX

5 - The browser should highlight that. Use your mouse to make sure the XXXXX is highlighted and use CTRL+V to paste the HTML from FeedWind.

This will place the widget wherever the marker was put. The only reason to use this method is to easily locate your placement on a page - even if you are experienced at coding, this might save you time. 
 

EMBED RSS WIDGET IN SIDEBAR

Embedding the FeedWind RSS widget into a WordPress SideBar

To embed a widget in a sidebar, there are different methods depending on the platform. WordPress is the easiest. When you open the Widgets in the dashboard, you are given the option of numerous widget types. To embed your RSS feed into a WordPress sidebar, simply drag an empty text widget into the sidebar you want to display it in, then paste your HTML code from the FeedWind Setup page into the text widget. If you want, you can also copy it and add it to an existing text widget. Just make sure the dimensions of the widget you made will fit in the sidebar.

Embedding the FeedWind RSS widget into a Joomla SideBar

Joomla treats sidebars as modules. These have a management section separate to the page/post/article editors in Joomla but essentially they have the same approach as a page/post/article because they share the same editor. This means that the same principle can be applied as with embedding into a page/post as described above.

Embedding the FeedWind RSS widget into a Drupal SideBar

This is essentially the same process as with Joomla. The same editor as the posts/pages editor is used to create content for sidebars.

Check Your Code

Most other CMS (Content Management System) have a similar structure to either Joomla or WordPress and allow the HTML from FeedWind to be pasted anywhere that  supports HTML. Users must be aware that some CMS will "adjust" the HTML you put in. This can take various forms such as treating the code as a CDATA entry (common in WordPress). In this case the CDATA open/closing entry must be deleted. Other CMS might create a <div> (which is ok), or add/encapsulate your widget in other code. If your widget does not display, the first port of call is to check the code again. Removed line breaks are not usually a problem, but code that is added or removed by the CMS can stop FeedWind from working properly.

RSS Feed Widget


In many cases it is convenient for users to add together RSS feeds so we have included this feature in the FeedWind RSS widget. Its really easy to use;

Simply paste your feed URL into the FeedWind setup screen, and click on the [Add Feeds] button then repeat the exercise until all your feeds have been added. The on-screen Preview will update in real time so in just a few minutes you can generate an aggregated feed of all your favorite RSS feeds added together. We made the process as simple as possible to help smooth the process of creating a single feed from multiple RSS URLs!

adding RSS feeds
RSS Feed Widget

This can be repeated for multiple feeds which will be listed directly below the entry field. The real-time preview will update accordingly so you can see the sequence of the feed items. This easy-to-use RSS feed aggregation allows you to quickly create an RSS display widget that contains information from different sources and sites. This improves the quality and variety of information you can make available.

Because we offer autoscrolling and various sorting options too, you can really make the most of the page space you have available on your websites.

Note: Adding more than 10 feeds together can make your page loading very slow and it can also cause the widget not to display properly. This is because for every feed URL you add, our server has to poll other servers to get the feed content from them. This can cause our server to timeout where responses are slow and ultlimately cause problems.

Make your site the 'go-to' place when it comes to the best information available on any topic by using FeedWind aggregated feed widgets.



With FeedWind you are in complete control of the title of your feed(s). With just a few adjustments you can alter the feed title for your RSS feed container and change the link address too. This allows you to offer a n alternative to the title link that is contained in the RSS feed you are using.

You can also disable the link altogether and have a simple text title (or none at all if you prefer!) The backgrounds and font colors for your widget can be changed too in the advanced Settings section (see image below).

There are several available settings:

Item Settings    
Feed Title display:   On Off
Feed Title Text: From Feed User-defined None
Feed TItle URL: From Feed User-defined None
Feed Title Background: Color Selector User-defined None


These settings are made in the Feed Title section of the FeedWind Setup screen as follows:



FeedWind now features a reverse text direction control in the FeedWind setup screen. This new feature allows users the option to display reverse text languages in their RSS feed widget. There are a number of languages which require right to left text functionality - Wikipedia has a list of reverse-text languages and further information on the topic.

To use the feature in the setup screen, simply click on the General >Advanced Settings section and select the text direction that you would like to use. Make sure you also check the text alignment to align the text correctly relating to the chosen text direction. If you use Right-to-Left then text needs to be aligned right or justified - For Left-to-Right text, alignment should be set to left or justified.


reverse text rss widget


Advanced Users

There is no need to create any custom CSS to reverse the text direction in your RSS feed widget but advanced users might like to use CSS to create a more specialized feed with combinations of right-to-left and left-to-right text possible. You can set the text direction for individual RSS feed components with a custom CSS - see our reverse-text with CSS tutorial here).



rss widget problem with IE8Some users have reported problems related to IE8. We recommend comparing your widget code that you copied, to that which the page has when published (hover over the widget, right click and "examine object" or a similar menu item) will all you to open the console (or pres F12) and see that page's HTML. Another method is to visit the page then save the page from your browser then view it in a HTML reader. or open it in notepad.

If this part of the code displays line the following on your live page the FeedWind RSS widget will not work.The code in red is incorrect:

rssmikle_item_podcast="off";
//</script>

<br />
--&gt;

<script src="http://widget.feed.mikle.com/js/rssmikle.js"
type="text/javascript"></script>



The FeedWind RSS widget now has a Time Zone feature so that your feed entries display the time in your local Time Zone. When the Time/Date feature is switched to "On", the time/date of each entry is displayed below each feed content item. There are settings available for different time and date formats and for different TimeZones. The date/time feature can also be switched off altogether.

rss feed timezone feature



The FeedWind RSS widget has a sort feature to allow feed items to be displayed in a predefined sort order. Its really easy to set up and only takes a click or two to implement. The sort feature has three options and can be found in the setup screen at FeedWind in the General section >Advanced Settings. The sort options are:

  1. Newest - The newest feed item appears at the top
  2. Oldest - The oldest feed item appears at the top
  3. Random - The sort order for the feed is randomized
  4. Off - The sort order is controlled by the incoming feed XML

Placing the newest at the top helps you maintain the most current feed item in view to keep your page up to date. If your RSS feed has many entries, using autoscroll can help get the whole feed into view without having to create a large widget and use up a lot of screenspace. For feeds that are not date sensitive, a random sort is a good solution.

sorted rss widget



There are two types of Facebook RSS feeds; the first is a timeline RSS feed, the second is a notifications RSS feed.

Facebook posts RSS feed

This URL for example gives you a feed from our own facebook page but you can replace the red with your own ID to create your own custom RSS newsfeed from Facebook.

https://www.facebook.com/feeds/page.php?id=605201699542822&format=RSS20

To get the best results you can open the >Advanced section of the FeedWind setup screen where you can switch the HTML tag to "On" which will enable things like videos and images to be displayed as clickable thumbnails.

Here is an example using our own Facebook page.

RSS Feed Widget

Facebook notifications RSS feed

To get Facebook notifications only in your Facebook RSS feed, you can log into your facebook account, then go to https://www.facebook.com/notifications and you will see:

Get notifications via: RSS

 

Right-click on the RSS link and copy the link address - this is the URL you will put into the FeedWind setup page.