• 0

RapidTabs Section Customization


Question

Posted · Report post

Hi

 

Can anyone help with how you control the RapidTabs section please?

 

I only want it to show the recent and popular posts, i don't want it to show the comments and tags tabs. I would also like to control the navigation in the section.

 

I can't find where there are any options? All i see when i click on the edit button is the option to add CSS classes.

 

Please help!

 

Allan 

Share this post


Link to post
Share on other sites

14 answers to this question

  • 0

Posted · Report post

No worries. Thanks. I actually have figured out that it's a plug-in conflict. I was fooled because this works with the plug-in on other sites. The difference is that those other sites use the free version and this site uses the Pro version of Ai1EC a calendar by Time.ly. So I'm giving up making it work. I'm going to edit out Categories from RT and just use a different plugin to make a category cloud in the sidebar.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

I'd love to know this as well...

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

If you go to the top of the RapidTabs section, when you mouse-over, you should see a little pencil icon.  Click it. That will open the settings. 

 

As for the tabs you don't want to display, I'd suggest finding the unique CSS elements for each, then applying display: none; to them. But be careful or you could make the entire thing vanish.

 

You could also use a simple tabs code, and place Special Recent Posts shortcode in one tab, and a popular posts shortcode in the other. 

 

I haven't used it yet, so I'm not familiar with it yet. 

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi Rob

 

Thanks for the reply. I have managed to get rid of the tabs that i don't want, but there is no visible CSS sheet for me to edtit to change the colours of the tabs. I would also like to remove the border line around the box but can't see where to do that either? 

 

If you could have a look for me and advise, that would be great. I really like the RapidTabs section, but the customization options seem non existent!

 

Allan 

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi Allan,

 

The RapidTabs section was built to be rapid :D

Therefore, there aren't any customization options, you're simply supposed to drag and drop the section into position and thats it.

 

However, what you could do is, use our tab shortcode alongside a text widget/textbox section with the Special Recent Posts plugin, which I think supports popular posts. You can achieve a similar look to rapid tabs but have more control.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Thanks Danny, i'll have a look at the Special Recent Posts plugin and see how i get on.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi Rob

 

Thanks for the reply. I have managed to get rid of the tabs that i don't want, but there is no visible CSS sheet for me to edtit to change the colours of the tabs. I would also like to remove the border line around the box but can't see where to do that either? 

 

If you could have a look for me and advise, that would be great. I really like the RapidTabs section, but the customization options seem non existent!

 

Allan 

Hey Allan,

 

Could you share the code you used to get rid of some of the tabs. I'm using this at the moment: .section-rapidtabs .the-rapid-tabs .rapid-nav a {display:none;} and it gets rid of all the tabs.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

As Danny suggested, try the Tabs here:  http://docs.pagelines.com/tutorials/shortcodes

 

Special Recent Posts lists only the last X number of posts, not based on popularity, but there are other plugins that do most popular posts, or list comments, etc.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi ppotent

 

I didn't actually add any custom code to remove the tabs i didn't want, i actually edited one of the php files.

 

If you use ftp to navigate to the wp-content/themes/dms/sections/rapidtabs folder, then you need to download the section.php file.

 

In that file you will see a load of code and in particular you will see the following sets of code which i have highlighted in four different colours so you can tell where one tab starts and finishes. All you need to do is delete the code for the tabs you don't want to show, then save the file and upload it again via ftp. Hope that helps!

 

 

<div id="rapid-popular">
 
<h3 class="widget-title"><?php _e('Popular Posts','pagelines'); ?></h3>
<ul class="media-list">
<?php
 
foreach( get_posts( array('numberposts' => $num_posts, 'ignore_sticky_posts' => 1, 'orderby' => 'comment_count', 'exclude' => $pageID) ) as $p ){
$img = (has_post_thumbnail( $p->ID )) ? sprintf('<div class="img"><a class="the-media" href="%s" style="background-image: url(%s)"></a></div>', get_permalink( $p->ID ), pl_the_thumbnail_url( $p->ID, 'thumbnail')) : '';
 
printf(
'<li class="media fix">%s<div class="bd"><a class="title" href="%s">%s</a><span class="excerpt">%s</span></div></li>', 
$img,
get_permalink( $p->ID ), 
$p->post_title, 
pl_short_excerpt($p->ID)
);
 
} ?>
 
 
</ul>
 
</div>
<div id="rapid-recent">
<h3 class="widget-title"><?php _e('Recent Posts','pagelines'); ?></h3>
<ul class="media-list">
<?php
 
foreach( get_posts( array('ignore_sticky_posts' => 1, 'orderby' => 'post_date', 'order' => 'desc', 'numberposts' => $num_posts, 'exclude' => $pageID) ) as $p ){
$img = (has_post_thumbnail( $p->ID )) ? sprintf('<div class="img"><a class="the-media" href="%s" style="background-image: url(%s)"></a></div>', get_permalink( $p->ID ), pl_the_thumbnail_url( $p->ID, 'thumbnail')) : '';
 
printf(
'<li class="media fix">%s<div class="bd"><a class="title" href="%s">%s</a><span class="excerpt">%s</span></div></li>', 
$img,
get_permalink( $p->ID ), 
$p->post_title, 
pl_short_excerpt($p->ID)
);
 
} ?>
 
 
</ul>
</div>
 
<div id="rapid-comments">
<h3 class="widget-title"><?php _e('Comments','pagelines'); ?></h3>
<ul class="media-list">
<?php
$comments = get_comments( array( 'number' => $num_posts, 'status' => 'approve' ) );
if ( $comments ) {
foreach ( (array) $comments as $comment) {
 
$post = get_post( $comment->comment_post_ID );
$link = get_comment_link( $comment->comment_ID ); 
 
$avatar = $this->get_avatar_url( get_avatar( $comment ) ); 
$img = ($avatar) ? sprintf('<div class="img"><a class="the-media" href="%s" style="background-image: url(%s)"></a></div>', $link, $avatar) : '';
 
printf(
'<li class="media fix">%s<div class="bd"><a class="title" href="%s">%s</a><span class="excerpt">%s</span></div></li>', 
$img,
$link, 
wp_filter_nohtml_kses($comment->comment_author), 
stripslashes( substr( wp_filter_nohtml_kses( $comment->comment_content ), 0, 50 ) )
);
}
 
}
?>
 
 
</ul>
 
</div>
<div id="rapid-tags">
<h3 class="widget-title"><?php _e('Tags','pagelines'); ?></h3>
<div class="tags-list">
<?php
 
wp_tag_cloud( array('number'=> 30, 'smallest' => 10, 'largest' => 10) );
?>
 
 
</div>
 
</div>
1 person likes this

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Thanks for sharing.

However, I can not recommend editing of core files, as this is something we do not recommend nor support. I suggest you try the alternative and use the tabs shortcode in a text widget.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

allanlove thanks for this info as it gave me enough to go in and make some changes. I changed the sequence of the tabs and changed the tags to categories! I'm saving a copy off-site in case it gets overwritten. Works like a charm. You can see it on the dev site at http://etc.hoffmangraphics.com/taffy-barrel-math/

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

sheilahoff Glad you got it sorted Sheila!! Sorry for the delay in my response, I have been away.

 

Allan

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

I'm going crazy with this. I have the code I created working correctly on 2 sites but on a new dev site the Categories are not being called. I know it's using my customized code as the sequence of tabs is changed and the last tab is categories instead of tags. I can NOT figure out why the same code works on two sites and not on the third. The site that it doesn't work on is http://www.tca.hoffmangraphics.com (bottom left of homepage). And here's my custom section.php file code which I have setup in a child theme.

<?php
/*
	Section: RapidTabs
	Author: PageLines
	Author URI: http://www.pagelines.com
	Description: Displays your most popular, and latest posts as well as comments and tags in a tabbed format.
	Class Name: PLRapidTabs
	Filter: widgetized
	Edition: pro
*/

class PLRapidTabs extends PageLinesSection {

	function section_persistent(){

	}
	
	function section_styles(){
		pl_enqueue_script( 'jquery-ui-tabs' );
	}
	

	function section_head(){

		?>
		<script>
		!function ($) {
			$(document).on('sectionStart', function( e ) {
				$('.the-rapid-tabs').tabs({
					show: true
				})
			})
		}(window.jQuery);
		</script>
		<?php

	}


   function section_template() {
		
		global $plpg; 
		$pageID = $plpg->id;


		$num_posts = 4; 

		?>
	<div class="widget">
		<div class="widget-pad">
	<div class="the-rapid-tabs">
		<ul class="tabbed-list rapid-nav fix">
			<li><a href="#rapid-recent"><?php _e( 'Recent', 'pagelines;' ); ?></a></li>
            <li><a href="#rapid-popular"><?php _e( 'Popular', 'pagelines;' ); ?></a></li>
			<li><a href="#rapid-comments"><?php _e( 'Comments', 'pagelines;' ); ?></a></li>
			<li><a href="#rapid-tags"><?php _e( 'Categories', 'pagelines;' ); ?></a></li>
		</ul>

		<div id="rapid-popular">

				<h3 class="widget-title"><?php _e('Popular Posts','pagelines'); ?></h3>
				<ul class="media-list">
					<?php

					foreach( get_posts( array('numberposts' => $num_posts, 'ignore_sticky_posts' => 1, 'orderby' => 'comment_count', 'exclude' => $pageID) ) as $p ){
						$img = (has_post_thumbnail( $p->ID )) ? sprintf('<div class="img"><a class="the-media" href="%s" style="background-image: url(%s)"></a></div>', get_permalink( $p->ID ), pl_the_thumbnail_url( $p->ID, 'thumbnail')) : '';

						printf(
							'<li class="media fix">%s<div class="bd"><a class="title" href="%s">%s</a><span class="excerpt">%s</span></div></li>', 
							$img,
							get_permalink( $p->ID ), 
							$p->post_title, 
							pl_short_excerpt($p->ID)
						);

					} ?>


				</ul>
	
		</div>
		<div id="rapid-recent">
				<h3 class="widget-title"><?php _e('Recent Posts','pagelines'); ?></h3>
				<ul class="media-list">
					<?php

					foreach( get_posts( array('ignore_sticky_posts' => 1, 'orderby' => 'post_date', 'order' => 'desc', 'numberposts' => $num_posts, 'exclude' => $pageID) ) as $p ){
						$img = (has_post_thumbnail( $p->ID )) ? sprintf('<div class="img"><a class="the-media" href="%s" style="background-image: url(%s)"></a></div>', get_permalink( $p->ID ), pl_the_thumbnail_url( $p->ID, 'thumbnail')) : '';

						printf(
							'<li class="media fix">%s<div class="bd"><a class="title" href="%s">%s</a><span class="excerpt">%s</span></div></li>', 
							$img,
							get_permalink( $p->ID ), 
							$p->post_title, 
							pl_short_excerpt($p->ID)
						);

					} ?>


				</ul>
		</div>

		<div id="rapid-comments">
			<h3 class="widget-title"><?php _e('Comments','pagelines'); ?></h3>
			<ul class="media-list">
				<?php
				$comments = get_comments( array( 'number' => $num_posts, 'status' => 'approve' ) );
				if ( $comments ) {
					foreach ( (array) $comments as $comment) {
						
						$post = get_post( $comment->comment_post_ID );
						$link = get_comment_link( $comment->comment_ID ); 
						
						$avatar = $this->get_avatar_url( get_avatar( $comment ) ); 
						$img = ($avatar) ? sprintf('<div class="img"><a class="the-media" href="%s" style="background-image: url(%s)"></a></div>', $link, $avatar) : '';
						
						printf(
							'<li class="media fix">%s<div class="bd"><a class="title" href="%s">%s</a><span class="excerpt">%s</span></div></li>', 
							$img,
							$link, 
							wp_filter_nohtml_kses($comment->comment_author), 
							stripslashes( substr( wp_filter_nohtml_kses( $comment->comment_content ), 0, 50 ) )
						);
					}
					
				}
			 ?>


			</ul>
			
		</div>
		<div id="rapid-tags">
				<h3 class="widget-title"><?php _e('Categories','pagelines'); ?></h3>
				<div class="tags-list">
					<?php 
wp_tag_cloud( array( 'taxonomy' => 'category' ) ); 
?>

				</div>
		
		</div>
				
		</div>
	</div>
</div>
		<?php
		
		


	}


	function get_avatar_url( $avatar ){
	
	    preg_match("/src='(.*?)'/i", $avatar, $matches);
	
	    return (isset($matches) && isset($matches[1])) ? $matches[1] : '';
	
	}
	
}



Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi Sheila, and Happy New Year!! This is a bit beyond my skill level I'm afraid. I think it might well be worth you starting a new thread to get some support on this. Sorry I can't help! Allan

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!


Register a new account

Sign in

Already have an account? Sign in here.


Sign In Now