Add content above featured pages


Note :This snippet works only with the Classical style option. The Classical style option can be enabled in Appearance > Customize > Advanced > Theme Style. More about the theme style option here


Method 1 : with an action hook

This will add a two column block before your featured pages on home.

 

Method 2 : with a filter hook

Add this function in your child theme’s functions.php

Your HTML code goes inside the $before_fp var, in between the single quotes. Please note that the HTML you input must have all single quotes escaped with a backslash (example: hell\’s kitchen).

Note that your content will only be displayed if you have the featured pages option active on your homepage. If you want to display content under the slider, instead of featured pages, consider using this snippet.

Note that functions.php is not supposed to be a modified copy of its parent theme counterpart. If unsure, please read about how to create a child theme.


Related Snippets you may also like


We can help you to implement this snippet

Coding is our job and we know WordPress inside and out. We can help you to customize your website with small chunks of code snippets like this one.

Send us your request and we'll get back to you quickly.



68 thoughts on “Add content above featured pages

  • Arcee Palabrica

    Hey guys, just realized it’ll only show on the homepage. is it possible to make it also available when you’re on other pages like a blog post perhaps?

    btw im referring to method 1…

    • Menaka S

      Hi Arcee,
      You can achieve the desired result by removing the following two lines from the code.
      if (! is_home() || !is_front_page() )
      return;

  • Kjell Ericson

    Hi, I’ve tried to find code that makes it possible to add a full-width background to the section/area which contains the three zooming featured pages. In the same way as setting background color to a pagebuilder row. Pls see enclosed ill. So far I haven’t seen any code working in that direction. /Kjell

  • Eva

    Hi! Great theme, thank you!

    I would like to add content under the featured pages but above the footer. Could anyone explain to me how I can do this? I’ve tried several things but it all doesn’t work.

    Thank you!

    • Wolfgang Harbauer

      Thanks Rocco for the quick reply. If I understand you well, the code should look as follows. Where exactly do I have to paste this code? (Sorry for stupid questions, I am a newbie ): )

  • Wolfgang Harbauer

    Hi, I am impressed by this theme, great job!

    I have on question though: How can I make the text I write on the page which I use as Static Front Page above the “Featured pages”? If you have a look on my page http://eins-zwei-drei.es, the text I wrote appears under the “Featured pages”. (Sorry if this has been explained before, I read all the posta and did not find the answer)

  • jose camacho

    Hello! Great theme I LOVE it!!!

    I’m tring to use metoth 1 with no succes, I whant to show the content on my home page above featured pages, I’m missing something?

    I added the code to my child theme function.php, renamed my page to home and featured pages is selected :S

    Help Please!

    Thks!!

  • Henry

    Hello,
    Thank you for this great theme.
    How can I move the recent posts section on the home page above the featured pages section and below the slider section? in other words, inbetween the slider and the featured pages.
    Thank you!

      • Henry

        Dear Nicolas, thank you for your reply. I have read through the hooks API several times now, but I have to say I’m a bit confused. I also tried adding the sample code for “switching the position of the slider and the featured pages” to my child functions.php just to see how this works, but I keep getting an error message for this as well. However, can you please give me a hint on how to switch the position of the recent posts with the featured pages?

  • Dominion

    please, how can i add content under featured image in homepage? i will be glad if someone can help here. thanks

  • Anja

    HI there,
    I am a TOTAL newbie.
    FIrst business, first website.
    Its gone amazingly well thus far, I love this theme and I am happy with the site.
    Now I am getting picky and maybe getting over my head.
    I’d like the text on my home page to be above the featured images. I’ve tried the css things mentioned above and nothing happened. Can someone tell me what I might be doing wrong? I didn’t not do a childs theme bc i wanted to see if i could even make it happen first. So i typed it into the custom css.
    Here is what I did, please don’t laugh its its totally off:

    add_filter(‘tc_fp_block_display’, ‘content_before_fp’);
    function content_before_fp($html) {
    $before_fp = ‘Welcome to Full Circle Home Veterinary Care’s webpage.
    My goal is to provide veterinary care in a way you have not experienced before.  For me Full Circle Home Veterinary Care means caring for your animal from the moment it enters your home, guiding it gracefully through the golden years and then to a farewell that is as peaceful and pain free as possible. Being in your own home means that you and your pet can relax and get more out of your veterinary visit then you have ever before. I look forward to hearing from you!                                                                                                                                                 ⋅Dr. Anja Wurm”; ‘//Put your HTML inside this var
    return $before_fp.$html;
    }

    and here is my page: http://fullcirclehomevetcare.com/

    thank you very much ANja

  • Brooke

    Hi Nicolas,
    I love the Customizr theme and have the unlimited feature pages extension installed. I am trying to adjust my static front page to show the most recent post at the top and the featured pages beneath it BUT I can’t simply select the option to display the featured pages before the footer as I need both featured pages and recent post to be in the same section.
    I have elected to display the feature pages ‘before content’ but this puts them ahead of the recent post. Before updating the ufp extension I achieved the order I want by hooking the feature pages to ‘__after_article’ using this code snippet:

    I assume a similar piece of code could now shift the post to ‘before fp’ but I don’t know how to adjust the code and/or what the relevant hooks are.

    • Brooke

      Update: I figured this out by selecting ‘custom location’ for the featured pages then creating a copy of index.php in my child theme and adding:

      where I wanted the featured pages to appear. In my case, this was after:

      • Nicolas

        Hi Brooke, I am glad you figured it out so quickly!
        I would have recommended to set ‘__after_article’ as custom location.
        Best regards and enjoy the theme

  • Gregorio

    Hi, i’d need to add a google map just before the footer… could you help me, please? Thanks in advance.

  • George Papadopoulos

    Thanks for sharing!

    For this snippet I want to use different content when navigating to different languages. Is there a way to do this? I use qtranslate plugin.

    Thanks again.

    • Andrei Post author

      Yes, it’s possible and quite easy, actually. Just insert your content in as many languages you want, using qtranslate language shortcodes and wrap it up in __() function:

      • Tom Van Gramberen

        Hello Andrei

        Do you also have a solution to show different “language content” when using the Polylang plugin?

        Kind regards
        Tom Van Gramberen

  • George Papadopoulos

    How can I use this with different content for different languages? I use the qtranslate plugin.

    Thanks!

  • Jonatan

    I added the code and removed the slider. But now my problem is that the video and image I uploaded are not aligned and the Feature section is not aligned anymore either. Any thoughts?

  • Tabi Harvey

    Whenever I try to put this in my child theme’s freshly made functions.php it completely kills my site so I have to go delete that php file through filezilla (have tried creating one through my plugin (Orbisius) as well as downloading the one from this site). It just makes it go completely blank. I copy the function into the file after the <?php bit and added my bit but it just kills the site every time. Not sure if I'm missing something completely obvious as I'm a bit new to php (usually try and just edit the css but I need this function).
    Hope you can help.

  • Adam Dunn

    This theme is great and thank you… I would like to move the static page that’s under my featured pages to just above the featured pages but in a way to stay under the slider if i choose to add one later. I am brand new to .php

  • Paula Tiller

    I love the theme – thank you for making it available. I need to move the feature pages headings so that they appear above the photo. I’d be grateful if you could let me know how to do this.

    • Andrei Post author

      Here’s the snippet that you need, Paula:

      I have also added it as a stand-alone snippet, it will be live shortly.

    • Andrei Post author

      Just after posting the above solution I saw Nicholas has posted a complex snippet about how to move the featured pages anywhere on front page, which I didn’t know about. I recommend you should read it so you fully understand what the code does, in case you still have questions about it.

      • Paula Tiller

        Thank you for the reply and apologies for my delay in responding due to the holidays. Yes I had seen the longer post but that isn’t what I need to do. I want to keep the featured pages in the same position but move the h2 on the featured page so that it is situated above the image. It is probably really straightforward but I’m not a PHP coder and although I have looked around the site files I’m not sure where to look for this.

  • Laura Blackwell

    Hi Nicolas –
    Great theme! Thank you! I would like the third featured page on my front page to be a post, rather than a page. I would like to have my client update the ‘Hours and Directions’ of the business via post, and desire the functionality to have that post be my third ‘featured’ image/blurb. Any chances this could be done in custom CSS?

    http://newportlobstershack.com/

    Thanks for any help. – Laura

  • Jared

    Is there a way to add an image from the media library about the Feature Pages? To get the html code, I put it added the image to a page and pulled the html from the tab.

    add_filter(‘tc_fp_block_display’, ‘content_before_fp’);
    function content_before_fp($html) {
    $before_fp = ”;
    return $before_fp.$html;
    }

    It shows the image along with the code after the closing img tag.

    • Andrei Post author

      Yes, change

      $before_fp = ”;

      to

      $before_fp = ‘<img src=”put_your_image_url_here” alt=”image_description_here” />’;

      All you need to do is replace the texts above with the actual URL and description of your image.

  • Stacey

    How/where do I put the code for declaring the class? I’ve tried putting it in the functions.php and then my site didn’t work. I took it out of the functions.php and put it in the style.css and nothing happened (except my site works).

    Thanks,

  • Stacey

    Hi, I haven’t designed a site in years, but I am trying to mock something up for my non profit group. I was able to input the block as mentioned above. However, I would like the content to have a larger font. What code would I use? Also, I may want it in red instead of black. I may/may not want it centered, depending on how large of a font I can use.

    Thanks!

    • Nicolas

      Hi Stacey, the theme uses a CSS stylesheet to style every components. You might want to learn the CSS basics here (change font-size, colors, …) http://www.w3schools.com/css/
      Use a developer tool to find the HTML elements to modify (press F12 on your browser).

      Once you’ve written your CSS, just copy and paste it in the custom CSS field of the theme customizer, and you’re done.

      Hope this will help and enjoy the theme

    • Andrei Post author

      Practically, what you need is to declare a class for your div, let’s name it stacey-text:

      After that, add in style.css of your child theme or in the cutom CSS panel (Dashboard > Appearance > Customize) the rules for your class, like this:

      Just add up CSS declarations until it looks the way you want it. You’ll find all CSS properties listed at the link provided by Nicolas.

      • Val B

        Hi Andrei,

        I have managed to add into my functions.php the code to add text above the featured page section of my home page.

        My code is currently as following:

        add_filter(‘tc_fp_block_display’, ‘content_before_fp’);
        function content_before_fp($html) {
        $before_fp = ‘Phone: 075 8700 243 Email: valsschoolofmotoring@hotmail.co.uk‘; //Put your HTML inside this var
        return $before_fp.$html;
        }

        I have tried several different combinations on both this and the styles.css page to change the font, alignment. font size and colour of this text but to no avail….any help would be really gratefully received.

        Many thanks.

        Val

      • Val B

        Hi,

        Thanks for your reply.

        I tried to add the div classification (as per email) into the style sheet, but it is still not letting me make changes to the appearance of the text.

        I feel like I am missing something obvious…
        Sorry.

  • Richard M

    Hi, my question is related to Featured Images on the Front Page. After adding the featured images to the front page, I have found that they are not visible on the Front Page. I have gone through the entire process, including the ‘Set Featured Image’ step, yet it’s still not showing. Is this due to pixels, image density? If so, how can I fix it? I look forward to your response. Best, Richard

    • Andrei Post author

      The best way to get help with any question is to ask your question in a new topic on theme’s WP forum. I’m reluctant to find a solution for you here, because people searching for the same thing will probably not look for it in a snippet called “Add content above featured pages”. Also, a link would be quite helpful, usually makes things much clearer.

  • Michael Campos

    I have the WordPress Landing Pages plugin installed to create landing pages, and I would like to have one of them on the featured pages section on the homepage, but they don’t show up in the drop-down page selection. How can I get those on there?

    Thanks!

    • Andrei Post author

      I don’t know anything about WordPress Landing Pages plugin but from what you say it’s not creating actual pages, in the way that WordPress understands them. You can only select WordPress pages in featured pages. However, you may solve this by using a redirect plugin for pages and creating a page that would redirect to your landing page.

  • afj

    hi.. i found this interesting modifying great themes Customizr.
    i wondering to add portfolio carousel below static page. i use the static and assign a page to displayed on front page.

    i have use shortcode ultimate plugin to have a carousel. i want to put it above footer section.

    please help and give advice..

    • Andrei Post author

      In that case just echo your plugin shortcode after __loop:

      add_action(‘__loop’, ‘content_after_loop’, 11);
      function content_after_loop() {
      echo do_shortcode(‘[your-plugin-shortcode]’);
      }

      Pretty simple, right? 😀

      • Andrei Post author

        Yes: register_sidebar(). It’s a misleading name, it’s actually registering a widget area that can be in header, footer or anywhere else. After you have registered it, call it inside your layout (by hooking it after __loop, for example or anywhere else, you got the point) with dynamic_sidebar(“your widget’s name”) to display the content you added to it from the widgets area in admin. Of course, you need to style some in order to make it fit in the theme.

        • Sagar Manohar

          Can you please elaborate on this point so as to which files are to be edited/uploaded? I’m using a child theme and looking to add custom widgets on my homepage between the slider and featured pages. Thank you.

  • Allex

    Hi there,

    I was trying to find the file to delete the default dumb text below and wanted to add my own meta tag to facilitate my SEO but i could not find which file it is in, it is not in the index file or header. Appreciate your advice please.

    Thanks alot !
    Alex

    ” ……
    “!DOCTYPE html>

    Freelance Website Designers Developers

    …………

Comments are closed.