Nivo Slider in Highlight Theme - content and escaped characters WordPress
Hey -
I am working some changes to a site, I am using the [[LINK href="http://themeforest.net/item/highlight-powerful-premium-wordpress-theme/168424?WT.ac=search_thumb&WT.seg_1=search_thumb&WT.z_author=pexeto"]]Highlight[[/LINK]] theme that has been modified and in the Nivo slider admin area I have added content being a
<h1> Header Content</h1> and a paragraph in <p>content</p>.
I am trying to add a link with a style on it of "ctaButton" and I can not get it to work.
I asked the author and he said to remove the quotes, but the text field that captures the data, just adds it back in there and makes the message not read right, meaning a /> appears in the text.
Can anyone help, will to pay well to get it resolved asap. The page is http://www.r2ss.com/welcome-new/ - you will see the /> in the upper left on the first slide.
Answers (5)
Daniel Yoen answers:
try to change :
<img src="http://www.r2ss.com/wp-content/uploads/2013/04/slide1.png" title="<h1>R-Squared RADS Compliance Platform</h1>
<p>Confidently demonstrate and document your compliance with international, federal and state regulations on a scalable compliance platform.
</p><p><a href="http://www.google.com"></a></p>" />
to
<img src="http://www.r2ss.com/wp-content/uploads/2013/04/slide1.png" title='<h1>R-Squared RADS Compliance Platform</h1>
<p>Confidently demonstrate and document your compliance with international, federal and state regulations on a scalable compliance platform.
</p><p><a href="http://www.google.com"></a></p>' />
hope this help :-)
Daniel Yoen comments:
also, you can add caption this method :
<div id="slider" class="nivoSlider">
<img src="images/slide2.jpg" alt="" title="#htmlcaption" />
</div>
<div id="htmlcaption" class="nivo-html-caption">
<strong>This</strong> is an example of a <em>HTML</em> caption with <a href="#">a link</a>.
</div>
Daniel Yoen comments:
you can use this methode(valid html) :
<div class="slider-frame">
<div id="nivo-slider">
<a href="http://www.r2ss.com/compliance-solutions/"><img src="http://www.r2ss.com/wp-content/uploads/2013/04/slide1.png" alt="" title="#caption-1"/></a>
<a href="http://www.r2ss.com/compliance-solutions/aggregate-spend-compliance-software/"><img src="http://www.r2ss.com/wp-content/uploads/2013/04/slide2.png" alt="" title="#caption-2"/></a>
<a href="http://www.r2ss.com/cir2us/"><img src="http://www.r2ss.com/wp-content/uploads/2013/05/13677695463.jpg" alt="" title="#caption-3"/></a>
<a href="http://www.r2ss.com/compliance-solutions/irads/"><img src="http://www.r2ss.com/wp-content/uploads/2013/05/13677696394.jpg" alt="" title="#caption-4"/></a>
<a href="http://info.r2ss.com/rsquared-3-part-webinar-series-aggregate-spend/?hsctatracking=3dac8371-eb53-4b52-84e7-0963c9ce9f09%7c841eb03d-c077-4984-9db9-ad79fa95acb0"><img src="http://www.r2ss.com/wp-content/uploads/2013/05/13677697125.jpg" alt="" title="#caption-5"/></a>
</div>
<div id="caption-1">
<h1>R-Squared RADS Compliance Platform</h1>
<p>Confidently demonstrate and document your compliance with international, federal and state regulations on a scalable compliance platform.</p>
<p><a href="http://www.google.com"></a></p>
</div>
<div id="caption-2">
<h1>R-Squared Spend Tracker Compliance Automation Software</h1>
<p>Simplified web-based integration of aggregate spend from multiple sources, processes and data sets</p>
</div>
<div id="caption-3">
<h1>R-Squared Master Database Solution</h1>
<p>Cloud-based CiR2us integrates and consolidates master data from all enterprise data sources</p>
</div>
<div id="caption-4">
<h1>R-Squared iRADS</h1>
<p>Extend the reach of your base compliance platform to tablets for anywhere, on-demand views of provider status</p>
</div>
<div id="caption-5">
<h1>R-Squared Complimentary Webinar</h1>
<p>A Systemized Approach to Aggregate Spend and the Sunshine Act: Part 1 - Finding & Categorizing Spend - April 4, 2013</p>
</div>
</div>
hope this help :-)
Abdelhadi Touil answers:
Hi.
For me when I want to use the Nivo Slider in my wordpress themes with html captions, I use this code:
<div id="slider" class="nivoSlider">
<?php $features = new WP_query('posts_per_page=5&cat=1'); ?>
<?php while ($features->have_posts()) : $features->the_post(); ?>
<?php $post_id = get_the_ID(); ?>
<a href="<?php the_permalink() ?>" rel="bookmark">
<img src="[image link here]" alt="[image alt text here]" title="#caption<?php echo $post_id; ?>" />
</a>
<?php endwhile; ?>
</div><!-- #slider -->
<?php $features = new WP_query('posts_per_page=5&cat=1'); ?>
<?php while ($features->have_posts()) : $features->the_post(); ?>
<?php $post_id = get_the_ID(); ?>
<div id="caption<?php echo $post_id; ?>" class="nivo-html-caption">
<h2><a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title(); ?>"><?php the_title(); ?></a></h2>
<p><?php the_excerpt(); ?></p>
</div>
<?php endwhile; ?>
For me I use it to retrieve latest post from a featured category, I use with the above wordpress query other functions to make all think automatic (I mean retrieving the first images uploaded to each post and resize it, and other function to limit the excerpt leignt by characters, If you the full code I can post it here. Sorry for my bad English :)
Good luck.
Chris MacDonald comments:
Thanks everyone for the answers, but the content is written in via an web admin so I cant just add the code to the page - but that does not seem to be the issue now - I fixed things and I am using a different slider that supports content.
The images are supposed to be 921x385 and it is adding margin to the 3rd and 4th image and seems to resizing them as well. And the 5th gets an extra margin on the top image and is the right size.
Please HELP - I have no idea what is going on. You can see it at http://www.r2ss.com. All I want is for the images to be the same size and alignment with an equal margin around them . . . .
Abdelhadi Touil comments:
Hi. If you can PM me your FTP login info then I'll try to fix it for you.
Espreson Media answers:
I could not find any /> on the slider
Chris MacDonald comments:
Hey All - I had changed the page a bit to try and get it to work, sorry.
The main issue with this problem is that I have to add this via an Admin piece that places the content via this code:
<div id="nivo-slider">
<?php
$sliderImagesArray=explode(PEXETO_SEPARATOR, get_option($slider_prefix.'_nivo_image_names'));
$linkArray= explode(PEXETO_SEPARATOR,get_option($slider_prefix.'_nivo_image_links'));
$descArray= explode(PEXETO_SEPARATOR,get_option($slider_prefix.'_nivo_image_descs'));
$count=count($sliderImagesArray);
$linkCount=count($linkArray);
for($i=0;$i<$count-1;$i++){
if($i<$linkCount && $linkArray[$i]!=''){
echo('<a href="'.$linkArray[$i].'">');
}
echo('<img src="');
if(get_opt('_nivo_auto_resize')=='true'||get_opt('_nivo_auto_resize')=='on'){
$path=PEXETO_TIMTHUMB_URL.'?src='.$sliderImagesArray[$i].'&h=318&w=940&zc=1&q=80';
}else{
$path=$sliderImagesArray[$i];
}
echo($path);
echo('" alt=""');
if($descArray[$i]!=''){
echo(' title="'.stripslashes($descArray[$i]).'"');
}
echo('/>');
if($i<$linkCount && $linkArray[$i]!=''){
echo('</a>');
}
}
?>
</div>
So when I add content into the description area it comes out jacked up.
MDan answers:
Please see this:
http://support.ait-themes.com/discussion/411/different-characters-in-nivo-slider-and-kwicks/p1