WordPress is fantastically versatile blogging platform with next-to
endless potential for tweaking and customization. Whether you’re an
advanced web developer or a WordPress newbie there are a number of
solutions you can employ to give your project something extra.
I have been using WordPress for quite some time now and even I still find new solutions and tricks on a regular basis. Today, I am using my experience to bring you the best 20 WordPress tips and tricks that will have you stop reaching for Panadol in no time.
Create a new page and choose your new template as the page template.
Once you have published this page go to Settings » Reading in your admin panel. And select your page to be the homepage. Now you have yourself a Custom Home Page.
Create a php file and name it mycontent.php. Now when you create a conditional if statement reference your page as follows:
I have been using WordPress for quite some time now and even I still find new solutions and tricks on a regular basis. Today, I am using my experience to bring you the best 20 WordPress tips and tricks that will have you stop reaching for Panadol in no time.
1. How to Use a Custom Page as a Home Page
This is pretty basic, however it is probably one of the most popular WordPress tips for beginners. Creating a custom page and using it as a homepage is great for creating a truly unique homepage.- <?php /* Template Name: MyCustomWPTemplate */ ?>
- <!-- Your Custom Page Content -->
Create a new page and choose your new template as the page template.
Once you have published this page go to Settings » Reading in your admin panel. And select your page to be the homepage. Now you have yourself a Custom Home Page.
2. Create A Custom Loop
Creating a custom loop is one of the greatest fundamental functions of WordPress. A custom loop can lead to big improvements for your site in terms of both usability and visual aesthetics. Displaying a custom loop is pretty easy.- <?php query_posts(array(
- 'post_type' => 'post',
- 'posts_per_page' => 10 ));
- if (have_posts()) : while (have_posts()) : the_post(); ?>
- <!--Your Custom Loop Content Goes Here-->
- <?php endwhile; endif; wp_reset_query(); ?>
3. Filter Posts From Tag or Categories
So presuming you have made a custom loop, you may want to filter your loop by taxonomy or category. This is great for custom homepages as you can have multiple categorized loops on one page.- <?php query_posts(array(
- 'post_type' => 'post',
- 'cat' => 'post_category', // This will filter by category
- 'tag__in' => array( 'post_tag' ), // This will filter by tag
- 'posts_per_page' => 10 ));
- if (have_posts()) : while (have_posts()) : the_post(); ?>
- <!--Your Loop Custom Content Goes Here-->
- <?php endwhile; endif; wp_reset_query(); ?>
4. Reference An External .php file As Content
If you are creating complicated queries using if statements you can reference external php pages rather than including your conditional content directly in a page or loop. This will make your page load a lot faster as WordPress doesn’t need to process as much php. This is why most professional web developers organize their content in external php files and then reference it when needed.Create a php file and name it mycontent.php. Now when you create a conditional if statement reference your page as follows:
- <?php get_template_part('content', 'mycontent'); ?>
5. Display Random Posts In A Loop
A cool feature in WordPress is the ability to create custom loops that will display a random post. This is useful for creating ‘Surprise Me’ style pages that will display a random post every time it is clicked.- <?php
- query_posts(array(
- 'post_type' => 'post',
- 'orderby' => 'rand',
- 'posts_per_page' => 1 ));
- if (have_posts()) : while (have_posts()) : the_post(); ?>
- <?php the_content(); ?>
- <?php endwhile; endif; ?>
6. Remove Image Attributes For Inserted Images
When you upload an image through your media importer and insert it into a post, WordPress will automatically add HTML attributes defining the width and height of the image. If your website is responsive, this is especially irritating as you will have to manually delete the width and height of every inserted image. The code below removes the inserted HTML attributes making all your images 100% responsive.- add_filter( 'get_image_tag', 'remove_width_and_height_attribute', 10 );
- add_filter( 'post_thumbnail_html', 'remove_width_and_height_attribute', 10 );
- add_filter( 'image_send_to_editor', 'remove_width_and_height_attribute', 10 );
- function remove_width_and_height_attribute( $html ) {
- return preg_replace( '/(height|width)="\d*"\s/', "", $html );
- }
7. Force High Quality JPG Images
If your site relies on a lot of images in your content (maybe you’re a photographer), you’ll want these to be high quality. By default, WordPress reduces all your images to 90% quality to reduce page size. You can change this to 100% quality quite easily. Alternatively you can also lower this to 85 or 80 if you want to save some size on your pages. Just add the following code in your themes functions.php file.- add_filter('jpeg_quality', function($arg){return 100;});
8. Conditionally Apply Content
One handy tip is to conditionally display content depending on the page type. This can be used for a number of optimizations including external stylesheets, custom JavaScript or even in your footer, sidebar or header. Below are a number of useful conditional statements, in no-particular order. You can use different combinations of them by using if, else and elseif statements.- <?php if(is_home()) { ?> <!--Your Conditional Content--> <?php }
- // Returns true only on the homepage ?>
- <?php if(is_single()) { ?> <!--Your Conditional Content--> <?php }
- // Returns true only on Single post pages ?>
- <?php if(is_post_type_archive()) { ?> <!--Your Conditional Content--> <?php }
- // Returns true only post type archives?>
- <?php if(comments_open()) { ?> <!--Your Conditional Content--> <?php }
- // Returns true only if comments are open for a post?>
- <?php if(is_page()) { ?> <!--Your Conditional Content--> <?php }
- // Returns true only if a page is being displayed?>
- <?php if(is_page_template( 'pagetemplate.php' )) { ?> <!--Your Conditional Content--> <?php }
- // Returns true if page template is being used?>
- <?php if(has_term('green')) { ?> <!--Your Conditional Content--> <?php }
- // Checks if a term appears in a post ?>
- <?php if(is_author('Jonhn-Doe')) { ?> <!--Your Conditional Content--> <?php }
- // If John Doe has written this post ?>
9. Display Twitter Follower Count as Text
Displaying your twitter follower count is a great feature to add to make your website more social-media friendly and can be done quite easily. Create a file named twitter.php and paste the following code into it.- $tw = get_option("twitterfollowerscount");
- if ($tw['lastcheck'] < ( mktime() – 3600 ) )
- {
- $xml=file_get_contents('http://twitter.com/users/show.xml?screen_name=wpbeginner');
- if (preg_match('/followers_count>(.*)</',$xml,$match)!=0) {
- $tw['count'] = $match[1];
- }
- $tw['lastcheck'] = mktime();
- update_option("twitterfollowerscount",$tw);
- }
- echo $tw['count'];
- <?php include("twitter.php"); ?>
10. Customize Blog Title Depending On Page
In your WordPress admin panel you can choose your website title. This title will show up in Google search results as well as in the browser tab. You can customize this title depending on the page. Add the following code into your theme’s functions.php file.- function mycustomthemetitle( $title ) {
- global $paged, $page;
- if ( is_feed() )
- return $title;
- if ( is_singular() || is_archive() || is_category() )
- return $title;
- $title .= get_bloginfo( 'name' );
- if ( $paged >= 2 || $page >= 2 )
- $title = sprintf( __( 'Page %s' ), max( $paged, $page ) );
- return $title;
- }
- add_filter( 'wp_title', 10, 2 );
11. Modify Excerpt Length and More Tags
Customizing your excerpt length is pretty easy. By defualt WordPress uses words to count the excerpt length. You can easily change this length and also the edit the read more text. Drop the following code in your theme’s functions.php file.- // Changing excerpt length
- function new_excerpt_length($length) {
- return 100;
- }
- add_filter('excerpt_length', 'new_excerpt_length');
- // Changing excerpt more
- function new_excerpt_more($more) {
- return '...';
- }
- add_filter('excerpt_more', 'new_excerpt_more');
12. Link to Your Blog Post In The Excerpt’s More Tag
When you call the_excerpt() function, WordPress automatically includes the more tag. You can link to you blog post easily by changing the default more tag. Place the following code in your theme’s functions.php file.- // Replaces the excerpt "more" text with a link
- function new_excerpt_more($more) {
- global $post;
- return '<a class="moretag" href="'. get_permalink($post->ID) . '"> Read the full article...</a>';
- }
- add_filter('excerpt_more', 'new_excerpt_more');
13. Limit Excerpt Length by Characters
By defualt, WordPress uses a word count to count the excerpt length. If you have specific space requirements or mabye you just want a more precise excerpt length, you can use characters instead of words for the excerpt count. Drop the code below into your theme’s function.php file.- function get_excerpt($count){
- $permalink = get_permalink($post->ID);
- $excerpt = get_the_content();
- $excerpt = strip_tags($excerpt);
- $excerpt = substr($excerpt, 0, $count);
- $excerpt = substr($excerpt, 0, strripos($excerpt, " "));
- $excerpt = $excerpt.'... <a href="'.$permalink.'">more</a>';
- return $excerpt;
- }
- <?php echo get_excerpt(125); ?>
14. Display Breadcrumb Navigation in WordPress
A lot of blogs use breadcumb navigation to show readers exactly where the current page they are viewing is located. There are a number of plugins to achieve this, however you can achieve the same results quite easily without the use of any plugins. Place the following code into your theme’s functions.php file.- function MyBreadcrumb() {
- if (!is_home()) {
- echo '<a href="';
- echo get_option('home');
- echo '">';
- echo 'Home';;
- echo "</a> » ";
- if (is_category() || is_single()) {
- the_category('title_li=');
- if (is_single()) {
- echo " » ";
- the_title();
- }
- } elseif (is_page()) {
- echo the_title();
- }
- }
- }
- <code><?php MyBreadcrumb(); ?></code>
15. Organise Your Functions.php file
Depending on your theme’s back-end setup, your functions .php file can get pretty messy and complicated, particularly if you frequently add custom codes into it. However there is a much easier way to organize things. Create a new file and name it mycustomfunctions.php. Add all your custom functions in this file. Then all you need to do is reference this file from your functions.php file.- include("mycustomfunctions.php");
16. Enqueue JavaScript Properly
WordPress has a built in function for inserting external JavaScript into your theme’s <head>, as apposed to inserting it directly. The benefit of using the enqueuescript function is that resolves any conflict issues that arise from multiple external script files. It also ensures they are loaded after any CSS. Drop the following code into your theme’s function.php file.- function add_scripts() {
- global $data; //get theme options
- //replace jQuery with Google hosted version
- wp_deregister_script('jquery');
- wp_register_script('jquery', ("http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"), false, '1.7.1');
- wp_enqueue_script('jquery');
- //replace jQuery UI with Google hosted version
- wp_deregister_script('jquery-ui');
- wp_register_script('jquery-ui', ("http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"), false, '1.8.16');
- wp_enqueue_script('jquery-ui');
- // Site wide js
- wp_enqueue_script('customscript', get_template_directory_uri() . '/js/customscript.js');
- }
- add_action('wp_enqueue_scripts');
17. Use Google Fonts Through CSS Enqueue
If you want to use Google’s WebFont archive you can enqueue the external font file directly from your theme’s functions.php file.- add_action('init', 'google_font_style');
- function google_font_style(){
- wp_register_style( 'GoogleFonts', 'http://fonts.googleapis.com/css?family=SOMEFONT');// Replace this url with the google font url you want to use
- wp_enqueue_style( 'GoogleFonts' );
- }
18. Disable HTML in WordPress Comments
Are you sick of getting lots of spam in your comments? Most spammers use html code to post links into comments, this is how they bypass your default spam security. You can disable this ability easily, add the following code into your theme’s functions.php file.- <pre>// This will occur when the comment is posted
- function plc_comment_post( $incoming_comment ) {
- // convert everything in a comment to display literally
- $incoming_comment['comment_content'] = htmlspecialchars($incoming_comment['comment_content']);
- // the one exception is single quotes, which cannot be #039; because WordPress marks it as spam
- $incoming_comment['comment_content'] = str_replace( "'", ''', $incoming_comment['comment_content'] );
- return( $incoming_comment );
- }
- // This will occur before a comment is displayed
- function plc_comment_display( $comment_to_display ) {
- // Put the single quotes back in
- $comment_to_display = str_replace( ''', "'", $comment_to_display );
- return $comment_to_display;</pre>
19. Styling Author Comments
Did you know you can style the author’s comments in WordPress? This is great for making your replies to your readers stand out more among other things. Use the CSS selectors below to change the author’s comments styling.- .commentlist .bypostauthor {}
- .commentlist li ul.children li.bypostauthor {}
20. Remove Detailed Login Error Information for Security
If you use the wrong name or password when trying to login to your admin panel, WordPress displays information on why the attempt was unsuccessful, like Incorrect Email Address or Incorrect Password. This poses a serious security threat as hackers can use this information to compromise your website. To remove the displaying of this information, add the following code into your theme’s funtions.php file.- add_filter('login_errors',create_function('$a', "return null;"));
21. Add Edit This Post Butom On Posts And Pages
Sometimes when you are reading over your latest post after you have published it, you may find a spelling error or something you would like to change. So you go to your admin panel and find the post and then edit it. This a lengthy process, particularly if you have a lot of posts. Luckily you can add an ‘Edit This Post’ button that will only appear for logged in administrators or authors. Place the following code where you would like the link to appear.- <?php edit_post_link(__('Edit This')); ?>
22. Display Feedburner Subscriber Count as Text
Another great trick is displaying your FeedBurner count as text. This helps gain more subscribers to your website and also just gives you bragging rights. Simply copy and paste the code below where you would like to display your count.- <?php
- //get cool feedburner count
- $whaturl="http://api.feedburner.com/awareness/1.0/GetFeedData?uri=your feedburner id";
- //Initialize the Curl session
- $ch = curl_init();
- //Set curl to return the data instead of printing it to the browser.
- curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
- //Set the URL
- curl_setopt($ch, CURLOPT_URL, $whaturl);
- //Execute the fetch
- $data = curl_exec($ch);
- //Close the connection
- curl_close($ch);
- $xml = new SimpleXMLElement($data);
- $fb = $xml->feed->entry['circulation'];
- echo $fb;
- //end get cool feedburner count
- ?>
0 comments:
Post a Comment