Details wordpress Add Friendship link Method _php Example

Source: Internet
Author: User
Tags rand sorted by name jquery library

Friendship links for a separate blog can be said to be a must, there are many people choose to join the sidebar link columns, but the establishment of a separate link page is also a good choice. With Plug-ins can easily do this, but like the original I, can solve their own hands, or to solve their own. After a while, the method came out.

Common method
set up a link page of the steps are relatively simple, first set up a new page template, Ufida chain function tune Ufida chain, plus CSS landscaping, things are done.

Here's a concrete step.

1. Create a new template page
Copy the page.php file in the topic and rename it to links.php.
Add the following code at the top of the page

<?php/
*
Template name:links
* *
?>

Then put a section of code similar to the following

<div class= "Post-content" ><?php the_content ();?></div>

Replaced by

Copy Code code as follows:

<div class= "lists" ><p class= "Tips" > site random sort </p><?php wp_list_bookmarks (' Orderby=rand&show_ Images=1 ');?></div>


Replace the links.php in the theme folder root directory, then create a new page, select the newly established Links in the page template, and save.
Explain the code above.
My_list_bookmarks is the function of WordPress tune Ufida chain, by order is the sort of friend chain, here I write is Rand, that is, the random show_images is to control whether the friend chain picture, Boolean variables, 1 represents the display variable, 0 is not displayed, and the other optional parameters are as follows:
Categorize
Boolean, which is used to set whether the connection is displayed in its own category category
String type, followed directly by "= Link Category ID Number", then the link under this category is displayed. Displays all links if not specified.
Category_name
String type, if the following "= Name of a link category" then displays the name of the category before the link is sorted, and if it is left blank, the category name (that is, the default form) for all the link categories is displayed.
Category_before
String type, the text or code that precedes the link classification.
Category_after
A string that is the text or code after the link category.
Class
String type, each link's category will have a "class" attribute (see from the above code), by default: Linkcat
Category_orderby
String type, the sort of link category, by noun or ID.
' Name ' (default)
' ID '
Category_order
String type, link classification of ascending and descending order:
ASC (default)
DESC
Title_li
A string type, the header text or code for a linked caption, by default: Bookmarks, and it controls whether the connection is arranged in a list.
Title_before and Title_after
As the name suggests, they are the text or code before and after the header header, and the default is the H2 label
Show_private
Boolean, whether to display private links.
Include
A string type that outputs a category link for the blogroll of the specified ID, separated by a half-width "," between each ID. All blogroll categories are displayed by default.
Exclude
A string type that excludes the Blogroll category link for the specified ID from the entire list of links, separated by a half-width "," between each ID. By default, nothing is excluded.
By
String type, Blogroll (default is sorted by name, unless this value is left blank), that is, according to our WP background link settings under the interface of those parameters to sort:
(1) ' ID '
(2) ' URL '
(3) ' name '
(4) ' Target '
(5) ' Description '
(6) ' owner '
(7) ' rating '
(8) ' Updated '
(9) ' rel ' – arranged according to the set relationship
(Ten) ' Notes '
(one) ' RSS '
() ' Length '-the name of the connection is set
(a) ' Rand ' – randomly arranged display
Order
String type, setting the order of the ascending and descending order
ASC (default)
DESC
Limit
An integral type that sets the maximum number of output link bars. The default value is " -1″, all output."
Between
string, text or code between each connection, picture, and description, and the default is "n" line wrapping.
Show_description
Boolean, whether the description of each link is allowed to be displayed.
Show_rating
Boolean, whether the level of the link is allowed to be displayed.
show_updated
Boolean, whether to allow display of the timestamp after the most recent update.
Hide_invisible
Boolean, whether to show all the links, or even be set by the administrator is not visible links, the default allowed to display.

2. Add CSS Landscaping, the following is a personal CSS for you to reference

. lists {padding:5px; margin:25px Auto Auto 0;}
. linkcat {font-size:12px; font-weight:bolder; padding:5px; margin-bottom:15px; list-style:none; Clear:both}
. List S Li H2 {font-size:14px; margin-bottom:15px; color: #99CC33;}
. Listcat ul {margin-left:20px}
. Linkcat ul li {float:left; margin-bottom:20px margin-left:20px; padding:4px 0 4px 6px width:150px; border:1px soli D #d9d9d9;}
. Linkcat ul li a {color: #a4a4a4; text-decoration:none;}
. Linkcat ul li a img {margin-right:3px}
. Linkcat ul li a:visited {color: #a4a4a4;}
Tips {font-size:14px; margin-bottom:18px; margin-left:5px;}

Using jquery
the specific implementation steps are two-step:
1. Loading jquery library, you can call Google jquery library directly

Copy Code code as follows:

<script type= "Text/javascript" src= "Http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" ></ Script>

2. Load jquery function code, note jquery closure
$ (". Linkpage a"). each (the function (e) {
$ (this). Prepend (" 
 
The meaning of this jquery is to iterate through all the a tags in all class linkpage, and then add IMG to the A tag, where ". Linkpage" needs to be changed according to its own template.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.