Links is the doorway to your website post and article. Some visitor may not find it easy to get access to all your website pages because it lacks poor navigation and less link display
So you have to make links available for your visitor in other to gain access to your pages which will help you get more traffic and less complain
Today we are going to write on how to display a randomly sliding (moving) link across your pages in wordpress site.
What make this article useful is that it will help the webmaster to see the all the links because it's display randomly.
Let starts
Did you know what is called Marquee in HTML
If not then.
Marquee is the code that helps master to pass an information using sliding links or texts.
Note: Only acceptable for wordpress users only
1. First, login to your admin area in wordpress.
2. Locate the www>> wordpress>>wp-content>>themes>> your template.
3. Open your template and scroll down to footer or header depending the place you want your sliding link to appear.
4. Let's starts with footer, Edit the footer.php with editor, At the top of your footer.php place this code.
<ul><marquee direction = "left" scrollamount ="2">
<li><?php
query_posts(array('orderby' => 'rand', 'showposts' => 5));
if (have_posts()) :
while (have_posts()) : the_post(); ?>
<a href="<?php the_permalink() ?>"><?php the_title(); ?></a> <img src="<?php bloginfo('template_directory'); ?>/images/ns.png">
<?php endwhile;
endif;
?></li>
</marquee> </ul>
5. Save and view your website.
Let's explain the code in the above picture
Line1: direction: left it means that the link will scroll from right to left.. you can change it to right.
Scrollamount:"2". It means that the scroll speed will be 2....you can change it to 3,10 and so on..the higher the speed.
Line3: orderby=> 'rand' it means that the link will be moving randomly.
If the word 'rand' is removed it will display according to the latest or last post.
Benefits of rand.
It will select from 2013 post and mix it with 2017 post.
Showposts=>'5' it means that the total amount of link to display in sliding link is 5, you can increase or decrease. 5,20.30 and so.
Line6: img.......images/ns.png"
This is where you insert those separate icon.
*make sure save the icon in the image file
* then change the ns.png" to your icon saved in your images files.
Add css of your choice...
you can place the above code in header.php
Example on how your sliding links moves
Post a Comment
Comment Here by clicking below link