Replace Minimum Pro Themes Tagline With Custom Field

The Minimum Pro theme by StudioPress includes a tagline which displays the same content site-wide after your header.

Update : This new tutorial provides the code which enables you to add both a custom tagline and a custom CTA button.

In this tutorial, we’ll replace the tagline with a custom field which enables you to add unique content in the tagline area of any or all single posts and pages.

Here’s an example of unique content which only displays in the tagline area of one single post:

Tagline Custom Field

Here’s the default tagline which displays site-wide after the header.

Minimum Theme by StudioPress

There’s 3 steps you will need to follow:

  1. Add PHP code in your child themes functions.php file.
  2. Add CSS code to the end of your child themes style.css file.
  3. Create a new custom field using the native WordPress custom fields meta box on any Edit Post screen

Related Code


Comments

37 responses to “Replace Minimum Pro Themes Tagline With Custom Field”

  1. idealynx Avatar
    idealynx

    Brad, what do I do if I want to keep the existing tagline formatting (font size and CTA button), but I want to customize the tagline for individual pages?

    1. Brad Dalton Avatar
      Brad Dalton

      Kelly

      Use the default CSS rules from the style.css file with the tagline-container class which i have added
      or
      the default divs which include 2 classes you can see in the default PHP in functions.php

      Also, use the is_singular(‘page’)) conditional tag

    2. Brad Dalton Avatar
      Brad Dalton

      Just updated the post with the code you need.

      You will need to add the custom CSS for the tagline-container class which applies to your custom field for single pages.

  2. Any suggestions on the best way to set a default content for the site tag on pages other than a post or page. I’d like to find a way to create a site tag for a category page or the home page

    the site tag shows up on a category page and the home page with

    if ( get_field(‘custom_tagline’) && is_page() or is_category() or is_home()

    but I’m not sure the best way to add content to the tag

    1. Brad Dalton Avatar
      Brad Dalton

      Try
      [code]
      ! is_singular(‘post’,’page’))
      [/code]

      To exclude single posts and single pages

      1. Sorry I should have checked how I phrased the question.

        I meant in addition to the individual posts and pages. For example when there is a menu with a direct link to a category or the home page.

        Those pages can’t be edited like a post and don’t have the acf meta box to enter the site tag content.

        I previous had a function that added a site tag and site tag widget on the home page and on specific category pages but it was removed with this edit. Basically I’m trying to do both!

        1. Brad Dalton Avatar
          Brad Dalton

          whats a site tag?

          1. Tagline. Sorry I combined site tagline!
            The tagline is blank on this page that is generated with a menu link to a category.

          2. Brad Dalton Avatar
            Brad Dalton

            You can hard code the default text like this:
            [code]
            echo ‘

            ‘;
            echo ‘Your Default Text’;
            echo ‘

            ‘;
            [/code]

            And change the conditional tags
            [code]
            ! is_singular(‘post’,’page’))
            [/code]

            Or you could modify the code like this

            [code]
            else {
            echo ‘

            ‘;
            echo ‘Your Default Text’;
            echo ‘

            ‘;
            [/code]

          3. From your updated code instead of using default text for categories I’m using the Category Description.

            I replaced

            [code]
            echo ‘ Archive Text ‘;
            [/code]

            with

            [code]
            echo ”. category_description(”) .”;
            [/code]

            I was wondering why the css isn’t applied with this change? If you add html to the category description it renders but the css doesn’t get applied.

          4. Brad Dalton Avatar
            Brad Dalton

            Not sure why as it should if its wrapped in a div class. See the last code snippet for an example.

  3. Lisa Sawyer Avatar
    Lisa Sawyer

    Brad – thanks for the post and your ongoing assistance in the support forum.
    Lisa

    1. Brad Dalton Avatar
      Brad Dalton

      Hi Lisa

      Support information. http://wpsites.net/registration/

  4. I like the customizability of this. Is there a way to have a background image in the tagline too? I uploaded an image to use as a background and then got rid of the color background.
    [code]
    .site-tagline {
    /*background-color: #0B7AD2;*/
    border-bottom: 1px solid #eee;
    margin-top: 60px;
    padding: 40px 0;
    }
    [/code]
    Unfortunately, it doesn’t seem to work. Well it work on the homepage only… I guess I’m missing a piece of the puzzle. Ideas?

    1. Brad Dalton Avatar
      Brad Dalton

      I don’t have the code setup in the them anymore however once you have the correct class, you could simply add a image using CSS:

      [code]
      .custom-tagline {
      background-image: url(‘images/bg.png’);
      }
      [/code]

      Assuming custom-tagline is the correct class which you can check using your favorite browser tool.

      1. Much appreciated, but nothing seemed to change for me. I kept the class as .site-tagline as I’m just trying to overwrite what already existed.
        [code]
        .site-tagline {
        /*background-color: #0B7AD2;*/
        background-image: url(‘images/VBN4tagline_bg.png’);
        border-bottom: 1px solid #eee;
        margin-top: 60px;
        padding: 40px 0;
        }
        [/code]

        1. Brad Dalton Avatar
          Brad Dalton

          Hard to say without seeing your site but if that’s the correct class then it should display the image if the file name and path are correct otherwise it may be caching which needs clearing.

          1. I deleted the cache, but still no go. The tagline image works on the homepage, but not the services or other pages.

            Thank you,
            David

          2. Brad Dalton Avatar
            Brad Dalton

            Add this at the every of your style sheet

            [code]
            .site-tagline {
            background-image: url(‘images/bg.jpg’);
            color: white;
            }
            [/code]

            And change the image name and extension to match your own.

            Tested and works.

          3. Brad,

            Thanks! Your last entry worked just great!

            – David

          4. Brad Dalton Avatar
            Brad Dalton

            Yeah, strange why it works at the end of the file but not when you modify the default CSS. Must be more CSS somewhere that needed changing.

  5. Sorry,

    I think I did not understand how I to ‘replace’. Should I delete some code? Just write it in the end as I do with CSS?

    I found that the first part (Add support for structural wraps) does exist already, so I just added that last one (Replace Site Tagline With Custom Field) in the end of functions.php and now there appear two fields instead of one.

    My website is pedromaiquez.es

    Thanks in advance! 🙂

    1. Brad Dalton Avatar
      Brad Dalton

      Yes, you will need to remove the original code an replace it with the modified version.

  6. Each time that I do this I loose the navigation which I have set to the primary navigation location. I modified my statement down to this as I would like to use it on all pages, but not posts.

    if ( get_field(‘custom_tagline’) && is_page() ) {

    Here is my ACF settings also: https://www.dropbox.com/s/v7a6st3njl140ao/ACF.png

    I am sure it is something simple that I am doing wrong. The functions, and css are input using genesis extender

    1. Brad Dalton Avatar
      Brad Dalton

      Hello David

      What you could do is use the custom menu in the header right widget area or reposition the primary nav menu.

      It may be where you placed the code because the screen shot proves it works but if you put the code in the wrong file, it may not.

      I didn’t use Genesis Extender when i tested the solutuon.

  7. Darren DeMatas Avatar
    Darren DeMatas

    This was really amazing and just what I was looking for. REALLY appreciate this.

  8. Darren DeMatas Avatar
    Darren DeMatas

    Thanks a ton!

    1. Brad Dalton Avatar
      Brad Dalton

      No worries Darren.

  9. Hi Brad, great tutorial, thanks. One question: does it also work on pages?

    1. Brad Dalton Avatar
      Brad Dalton

      Hello Erik.

      You will need to customize the conditional tag to work with pages as this post works with single posts only.

      1. Thanks Brad, can you please tell me what and where to put things, since I am not very familiar to coding.

        1. Brad Dalton Avatar
          Brad Dalton

          What you can do is change the conditional tag from is_single() to is_page().

          You can learn more about conditional tags on the WordPress Codex http://codex.wordpress.org/Conditional_Tags

          1. Ok, I understand, thanks anyway

          2. Brad Dalton Avatar
            Brad Dalton

            I updated this post to include pages which should help you achieve what you want.

          3. Thanks again

  10. Keith Davis Avatar
    Keith Davis

    Hi Brad
    I’ve got to change my main site over to Minimum Pro pretty soon so I’m keeping an eye on your Min Pro posts.

    Useful stuff as ever.

    1. Brad Dalton Avatar
      Brad Dalton

      Hi Keith.

      Look forward to seeing your new site on Minimum Pro.

Leave a Reply

Join 5000+ Followers

Get The Latest Free & Premium Tutorials Delivered The Second They’re Published.