Customization

Goal: RSS Feed with 3 columns over the full width inside a Joomla template.

Used for: I used a banner position located at the bottom of my template before the bottom and footer positions.
 
The trick is (vive versa against normal rule) to create in CSS a main container (here: art-rssFeeds) with position = relative
and nested the wished columns inside. I had to nested my banner 6 position in this div tag to avoid CSS conflicts. 

Step 1 - In my index.php file (in template folder) I created a new div tag: "art-rssFeeds" around my banner 6 position:

<div class="art-rssFeeds">
<jdoc:include type="modules" name="banner6" style="artstyle" artstyle="art-nostyle" />
</div>


Step 2:  Copy & paste the CSS style below into your template.css. 
I used primarily the Joomlaworks style.css in the default template and extended it for 3 instances of the module:

/***************************************************************/
/* Feed List - Module: Simple RSS Feed Reader - 3 columns style*/
/**************************************************************/
div.art-rssFeeds {position:relative;} /* Main container - must exist in index.php inside your template! */
div.art-rssFeeds .srfrContainer_rsscol-1 { /* Column left */
	position:absolute;
	top:0;
	left:0;
	width:31%;
	bottom:0;
	background:#f3f3f3;
	padding:17px;
}
div.art-rssFeeds .srfrContainer_rsscol-2 { /* Column center */
	position:relative;
	margin:0 auto;
	padding:17px;
  	width:31%; 
	height:auto;
	min-height:100%;
	background:#e3e3e3; 
}
div.art-rssFeeds .srfrContainer_rsscol-3 { /* Column right */
	position:absolute;
	top:0;
	right:0;
	width:31%;
	bottom:0;
	background:#f3f3f3;
	padding:17px;
}
div.srfrContainer_rsscol-1 ul.srfrList, div.srfrContainer_rsscol-2 ul.srfrList , div.srfrContainer_rsscol-3 ul.srfrList  {list-style:none;padding:0;margin:0;}
div.srfrContainer_rsscol-1 ul.srfrList li, div.srfrContainer_rsscol-2 ul.srfrList li , div.srfrContainer_rsscol-3 ul.srfrList li  {clear:both;padding:8px;margin:2px 0;border-bottom:1px dotted #ccc; text-align:left;}
div.srfrContainer_rsscol-1 ul.srfrList li.srfrRow0, div.srfrContainer_rsscol-2 ul.srfrList li.srfrRow0, div.srfrContainer_rsscol-3 ul.srfrList li.srfrRow0 {background:#fff;}
div.srfrContainer_rsscol-1 ul.srfrList li.srfrRow0 h3, div.srfrContainer_rsscol-2 ul.srfrList li.srfrRow0 h3, div.srfrContainer_rsscol-3 ul.srfrList li.srfrRow0 h3 {font-size: 12px;}
div.srfrContainer_rsscol-1 ul.srfrList li.srfrRow1, div.srfrContainer_rsscol-2 ul.srfrList li.srfrRow1, div.srfrContainer_rsscol-3 ul.srfrList li.srfrRow1 {background:#F7FAFE;}
div.srfrContainer_rsscol-1 ul.srfrList li.srfrRow1 h3, div.srfrContainer_rsscol-2 ul.srfrList li.srfrRow1 h3, div.srfrContainer_rsscol-3 ul.srfrList li.srfrRow1 h3 {font-size: 12px;}
div.srfrContainer_rsscol-1 ul.srfrList li img.srfrImage, div.srfrContainer_rsscol-2 ul.srfrList li img.srfrImage, div.srfrContainer_rsscol-3 ul.srfrList li img.srfrImage {float:left;margin: 0 10px 0 0;padding:2px;background:0;display:block;}
div.srfrContainer_rsscol-1 ul.srfrList li span.srfrFeedSource, div.srfrContainer_rsscol-2 ul.srfrList li span.srfrFeedSource, div.srfrContainer_rsscol-3 ul.srfrList li span.srfrFeedSource {}
div.srfrContainer_rsscol-1 ul.srfrList li span.srfrFeedItemDate, div.srfrContainer_rsscol-2 ul.srfrList li span.srfrFeedItemDate, div.srfrContainer_rsscol-3 ul.srfrList li span.srfrFeedItemDate  {color:#999;}




Step 3: Create 3 instances of the SRFR modules in Joomla backend with this settings:

1. The RSS feeds for the left column must have as Modul Class Suffix = "_rsscol-1"
2. The RSS feeds for the center column must have as Modul Class Suffix = "_rsscol-2"
3. The RSS feeds for the right column must have as Modul Class Suffix = "_rsscol-3"

Note: The center column needs one item more per feed to avoid that higher left or right columns are cut in display.

For all: 

1. Hide the titles of the modules - use instead the description box for text on top of the feed block (avoids for me issues with the standard CSS).
2. Optional: Set the display of the modules to the Frontpage only (I use the  Advanced Module Manager from nonumber.nl).


Optional: I fixed code in SRFR which produces a "blank" inside the class name when using the 'Modul Class Suffix'.

The module has 2 templates: Compact and Default. Both uses this blank in the class name.

For change: Go to the default.php file/s in modules/mod_sw_srfr/tmpl/default/ (and /compact/) and substitute in line 43: 

<div class="srfrContainer <?php echo $moduleclass_sfx; ?>"> 

with 

<div class="srfrContainer<?php echo $moduleclass_sfx; ?>">