Add URL field to the link post format

1 comment

1. In twentythirteen theme, the post format link is shown using the content-link.php file. The part that displays the link is:

   <h1 class="entry-title">
   <a href="<?php echo esc_url(twentythirteen_get_link_url());?>"><?php the_title(); ?></a>
   </h1>
   

   So the link is shown using the twentythirteen_get_link_url(); this function uses the wp function get_url_in_content() to get the first link in the content and shows it if there is one, if not it shows the the post permalink.

   Unlikely, these functions have no filter to the result, so to change this behavior you have 2 options:

   1. edit the theme file
   2. create a child theme

   The suggested solution is the second. In wp-content/themes folder create a folder named twentythirteen-child and inside it put 2 files. The first is the style.css that can contain just the required content:

   /*
    Theme Name:     Twenty Thirteen Child
    Author:         You
    Template:       twentythirteen
   */
   
   @import url('../twentythirteen/style.css');
   

   Now go to your dashboard and find this new created child theme and activate it. Visiting the site you’ll not see any change.

   Now copy the content-link.php file from the twentythirteen theme folder to your child theme folder. Find the code I posted above (should be lines 13-15).

   Replace with this:

   <h1 class="entry-title">
     <?php $link = get_post_meta( get_the_ID(), '_my_custom_link', true); ?>
     <a href="<?php echo $link ? esc_url($link) ? esc_url(twentythirteen_get_link_url()); ?>">
       <?php the_title(); ?>
     </a>
   </h1>
   

   Save it.

   Now you can add an hidden custom field '_my_custom_link' to the post and this will be used as url for the post.

   Being a hidden field (the key starts with '_') normally you have added a metabox for it, but once you want display after the title in the post edit screen you can use 'edit_form_after_title' action hook to display the field and ‘save_post’ hook to save it.

   When diplaying the field be sure that the post type is ‘post’, and the post format is empty (new post or no post format) or is equal to ‘link’.

   So, add a functions.php file in the newly created child theme, and in this file add:

   add_action('edit_form_after_title', 'my_url_form_field');
   add_action('save_post', 'my_url_form_field_save');
   
   function my_url_form_field( $post ) {
     if ( $post->post_type != 'post') return;
     $format = get_post_format($post->ID);
     if ( ! empty($format) && ($format != 'link') ) return;
     ?>
     <div id="urlwrap">
     <p>
     <label for="post-link-url"><strong>URL:</strong></label>
     <input type="text" class="large-text" name="_my_custom_url" size="30" value="<?php echo get_post_meta($post->ID, '_my_custom_url', true); ?>" id="post-link-url" autocomplete="off" />
     </p>
     </div>
     <?php
   }
   
   function my_url_form_field_save( $postid ) {
     if ( defined('DOING_AUTOSAVE') && DOING_AUTOSAVE );
     if ( isset($_POST['_my_custom_url']) ) {
       if (( strpos($_POST['_my_custom_url'], 'http://') !== 0 ) && (strpos($_POST['_my_custom_url'], 'https://') !== 0 ))
         $_POST['_my_custom_url'] = 'http://' . $_POST['_my_custom_url'];
       $url = filter_var($_POST['_my_custom_url'], FILTER_VALIDATE_URL) ? $_POST['_my_custom_url'] : '';
       update_post_meta($postid, '_my_custom_url', $url);
     }
   }
   

   Preview or what you’ll get:

   

   Now that you get it works, you can customize content-link.php in your child theme as you want.

   When twentythirteen gets an update, you can update it with no fear: your changes are secure in the child theme.

Comments are closed.