Posted on

Divi Page Builder and cleaner excerpts

by Mikko Saari

Getting Divi to show Relevanssi excerpts

Divi doesn’t use the default excerpts, but instead just truncates the beginning of the post and shows the first 270 characters. That means Relevanssi-generated excerpts don’t show up at all.

However, Divi can be configured to show Relevanssi excerpts. Just enable the “Use excerpts when defined” setting in Divi settings, and you should see Relevanssi-generated excerpts in the search results pages.

Divi "Use excerpts" setting
Enable the “Use excerpts when defined” setting to see Relevanssi-generated excerpts.

Another way to fix this is to change the excerpts to use the_excerpt(); instead of truncate_post( 270 );. ElegantThemes has good instructions on how to do that. Just follow these instructions, but where they tell you to enter truncate_post( 470 );, put in the_excerpt(); instead.

Custom Search Results templates

If you want to customize your search results template, Divi suggests using the Search Results template with the Blog module set to show the “Posts for Current Page”. That is unfortunately hopelessly incompatible with Relevanssi, and will result in “No results found” if Relevanssi is enabled. The only way to get Relevanssi search results with Divi is to not use a custom search results template.

Avoiding indexing menus

If you have menu blocks inside your posts, those menu contents will be indexed as part of every post that has the menu. That’s not very helpful. The way to solve this problem is to add a filtering function that will remove the menus from the posts. The exact content of the filtering function depends on how the menus are included in the post, but here’s an example of a function we used to clean out bunch of menus from one site:

add_filter( 'relevanssi_post_content', 'rlv_remove_menu' );
function rlv_remove_menu( $content ) {
    $content = preg_replace( '~\[et_pb_text admin_label="Accounts Menu.*?\[/et_pb_text\]~ims', '', $content );
    $content = preg_replace( '~\[et_pb_text admin_label="Footer Menu.*?\[/et_pb_text\]~ims', '', $content );
    $content = preg_replace( '~\[et_pb_text admin_label="Footer Address.*?\[/et_pb_text\]~ims', '', $content );
    $content = preg_replace( '~\[et_pb_text admin_label="Footer Social.*?\[/et_pb_text\]~ims', '', $content );
    $content = preg_replace( '~\[et_pb_text admin_label="Convenience Menu.*?\[/et_pb_text\]~ims', '', $content );
    $content = preg_replace( '~\[/?et_pb_.*?\]~ims', '', $content );
    return $content;
}

This function will clean out all the [et_pb_text] shortcodes and their contents where the label matches one of the menu labels.

Getting rid of page builder garbage

Update 27.4.2018: This is no longer necessary with Divi and Visual Composer, Relevanssi handles these automatically now.

If you’re using the page builder in Divi, it’ll work with Relevanssi, but the excerpts may look ugly because of the shortcodes the page builder uses to format the pages.

The solution is, however, easy: just remove the Divi shortcodes before the excerpt is built. The following code is placed in the theme functions.php and will remove all shortcodes that start with [et_pb before the excerpts are built. The code doesn’t affect the normal shortcode functionality, only the Relevanssi excerpts.

add_filter('relevanssi_pre_excerpt_content', 'rlv_trim_divi_shortcodes');
function rlv_trim_divi_shortcodes($content) {
    $content = preg_replace('/\[\/?et_pb.*?\]/', '', $content);
    return $content;
}

If you use the [et_pb_code] shortcode, it’s best to remove the contents of that shortcode as well:

add_filter('relevanssi_pre_excerpt_content', 'rlv_trim_divi_shortcodes');
function rlv_trim_divi_shortcodes($content) {
    $content = preg_replace('/\[et_pb_code.*?\].*\[\/et_pb_code\]/', '', $content);
    $content = preg_replace('/\[\/?et_pb.*?\]/', '', $content);
    return $content;
}

For Visual Composer, use this:

add_filter('relevanssi_pre_excerpt_content', 'rlv_trim_vc_shortcodes');
function rlv_trim_vc_shortcodes($content) {
    $content = preg_replace('/\[\/?vc.*?\]/', '', $content);
    $content = preg_replace('/\[\/?mk.*?\]/', '', $content);
    return $content;
}

If you want to simply get rid of all shortcodes in excerpts, try this:

add_filter('relevanssi_pre_excerpt_content', 'rlv_shortcode_blaster');
function rlv_shortcode_blaster($content) {
	$content = preg_replace('/\[.*?\]/s', '', $content);
	return $content;
}

72 comments Divi Page Builder and cleaner excerpts

  4. I am using the7 theme and get the same results. I added the code to my functions.php and reindexed. I still get the ugly descriptions, ideas?

    Reply

  5. An if there is more than one code to strip? is the same code?
    Also when some sharing plugins add text in the top of the post how can we strip that to? I am using Massahre and it displays the share count in the excerpt

    Reply

    1. Depends on how and where in the process the plugin adds the text. If it happens after Relevanssi is done, then it’s impossible to block from Relevanssi, if it happens before then it’s simple, just use relevanssi_excerpt_content filter to weed it out.

      And yes, you can add multiple preg_replace() lines to clean out multiple tags.

      Reply

  6. The problem of this solution is that all excerpts related to divi (such as title or text) will be ignore in the search results. Is there better solution for this problem? like, interpreting all of divi codes before considering theme as excerpt?

    Reply

    1. This solution doesn’t actually affect the search results, only the excerpts.

      Relevanssi expands all the shortcodes when preparing the content for excerpts, but the Divi shortcodes do not work properly and cannot be expanded at that point.

      Reply

  7. Thanks a lot for your quick reply. I know the results will remain the same, but the excerpt that will be show with the results may not be related to the search keyboard(s). For example if I search a title of divi text the excerpt will be unrelated to that because we ignore theme. All in all is there any better solution to keep the context of divi modules in the excerpts?

    Reply

  8. Mikko, I tried this (using visual composer). I used the replacement vc as you suggested and this did not work. Furthermore, search results are also showing wordpress short codes (e.x. [caption]) and theme shortodes

    Reply

      1. I assume so, I had Relevanssi installed & activated. Also, ensured the settings were set to not include shortcodes.

        Reply

        1. Relevanssi expands all shortcodes before building the excerpt, except the ones it cannot (for example the page builder shortcodes). Theme shortcodes need to be removed with the filter, as explained in the posts. WordPress shortcodes, like [caption], should be removed automatically.

          You’ve enabled the custom excerpts in Relevanssi settings? Adjusting Relevanssi excerpt settings changes the excerpts, for example if you adjust the length of the excerpt in the settings, it changes on the results page?

          Reply

          1. Wow, no shortcodes were removed when i used your patch.

            Yes, custom excerpts were enabled, yes it changed on the results page.

          4. On the first line inside the function, write:

            echo “running filter”; exit();

            and then do a search. If the filter is running, you should see the text “running filter” and nothing else.

          7. Maybe. That, or a typo in the code somewhere. Is the filter code in theme functions.php so that it gets noticed by WordPress? Somehow WP and Relevanssi are just not seeing the code.

          10. No such luck.

            My code:

            add_filter(‘relevanssi_pre_excerpt_content’, ‘rlv_trim_divi_shortcodes’);

            function rlv_trim_divi_shortcodes($content) {

            $content = preg_replace(‘/[/?vc.*?]/’, ”, $content);

            return $content;

            }

          14. Yeah, looks like so. If the code doesn’t help, I can’t help you much more, at least without a closer look at your site – and that’s something I can’t do here for free.

  9. Hello Mikko,

    I am using theKen theme from artbees which is using visual composer. As far as I read so far this might mean trouble. I seem to have similar problems like the rest. Codes like “[/vc_column_inner]
    [/vc_row_inner][/vc_column][/mk_page_section]” showing up in the search results. I did enter the code you posted into the functions.php of my childtheme like below

    function rlv_trim_divi_shortcodes($content) {

    $content = preg_replace(‘/[/?vc.*?]/’, ”, $content);

    return $content;

    }

    I could confirm the filter is running using echo “running filter”; exit(); and then removing it again.

    The text sniplets for searching a search term like “toleranzen” never the less looks like:
    …text_transform=“uppercase“ font_family=“none“]Toleranzen bei Stab und Coil[/mk_fancy_title]

    I did check the boxes on “new user defined search sniplet” and “execute shortcodes in results” in the relevanssi settings.

    Is there anything else I could try to solve this issue?

    Reply

      1. This is ist! Works great now! Thanks a lot, amazing! One last question though, before when doing a search and clicking on one of the results of the results page I am redirected to the site of the result and all search terms on that site are highlighted. In addition to that I had little stripe marks on the page scroll bar on the right side of the screen indicating the position where the searchterms are positioned on the page. These handy stripemarks are gone now. Is this a sideffect of the code I implemented or is there another setting I can change to get them back?

        Reply

        1. also there are still some search results that show MK_ codes like “[mk_step font_size=“25″… ” but much less.

          Reply

  10. Hello Mikko,

    I am using Jupiter Theme from Artbees, and visual Composer.

    What should I write instead of Divi?
    On funcitons.php I added
    “function rlv_trim_divi_shortcodes($content) {

    $content = preg_replace(‘/[/?[vc.*?]/’, ”, $content);
    return $content;
    $content = preg_replace(‘/[/[mk.*?]/’, ”, $content);
    return $content;

    }”

    Reply

        1. Are those excerpts generated by Relevanssi in the first place? If they are, that code should fix it, but if they’re not, then it doesn’t work.

          If you change the excerpt length settings from Relevanssi settings page, do the excerpts change?

          Reply

          1. Okay, first of all. Newbie-ish person here. I glanced through the manual, but did not find anything on what an excerpt actually was. I thought it was a query result. This mostly sounds above my head. ha!

          2. It has the same meaning as in regular English, ie. a snippet of text. That is, the part of the post that is shown on the search results page. See the excerpt settings in Relevanssi settings page. If you change the excerpt length in the settings, do the search results pages change?

          3. nope. does not look like this is working for me. I changed it to 10 words and still get this whole long thing like the wordpress search.

          4. Ok, that’s why the Relevanssi filter is not working: you’re not seeing Relevanssi-generated excerpts. If you have enabled custom excerpts in Relevanssi settings, the next step is to adjust your theme. That may be easy – there may be a setting in your theme settings that lets you adjust what is shown on the search results pages, ie. do you see whole posts or just excerpts – or difficult, as in requiring changes to your theme templates.

          5. okay. I’m not finding anything in the Divi settings but to set number of search responses. And I DO have custom snippets checked. What do I have to change to make Relevanssi the default search tool? I’m using a widget

          6. As far as I can tell, Relevanssi and Divi should work fine. Is Relevanssi powering the search in the first place? If you disable Relevanssi, do the results change?

          8. You may want to try disabling other plugins to see if there’s a conflict with Relevanssi; or try switching temporarily to one of the default themes to see if the problem is with the theme, though Divi should work with Relevanssi.

  12. Hello! It totally worked for my excerpts! Thank you very much!
    Another problem I am getting since I installed relevansii, is that the “no result” page from the search has the text all separated in three rows, like in the print screen. All the other pages where I get a “no result” (category pages with no posts for example), are looking normal.

    Like in the second print screen.

    Any idea why?

    https://uploads.disquscdn.com/images/70595651faadbe56d45459756252df144f68c4c4284e28d411acf81a773ba38f.jpg

    https://uploads.disquscdn.com/images/5727870949a6f5aabc055b4ef6f6c86e4ac8d6b37adcf1f144ba8f4f93942ab3.jpg

    Reply

    1. You have this in your CSS file, forcing the content to three columns:

      .search #left-area, .archive #left-area {
      -moz-column-count: 3;
      /* column-count: 3; */
      -moz-column-gap: 60px;
      /* column-gap: 60px; */
      }

      Reply

  13. Hello,
    I use the last version of DIVI theme of elegantthemes.com.
    I tried to use your plugin but seems not works fine.
    I saw that when I use the standard search field the url appear:

    http://www.domain.com/?s=personale and the search works fine!

    but If I use the search module of ET the url appear:

    http://www.domain.com/?s=personale&et_pb_searchform_submit=et_search_proccess&et_pb_include_posts=yes&et_pb_include_pages=yes

    and the result is blank!

    Why?

    I have created a functions.php file in /child theme folder but nothing.

    Anyone can help me ?

    regards
    Antonello

    Reply

    1. Can you use a different search form that would not add the unnecessary parameters? Perhaps the default WordPress search widget? Or you can create a pre_get_posts filter function that strips the unnecessary parameters off.

      Reply

  14. I used this method and it works.. but i also use [stm_post_info] in my post its theme component.
    Can you guide me how i can exactly prevent it from displaying in search too. Thanks

    Reply

    1. Nevermind one of your research below helped me understand the logic. It was fixed with this simple tweak addition:

      $content = preg_replace(‘/[/?stm.*?]/’, ”, $content);

      Reply

  15. In VC there’s also the [vc_raw_html] shortcode which usualy includes a raw huge line of random characters. These characters are not stripped out with the code provided here, but I’ve modified it a bit so it does. please feel free to use:

    /** strip out all shortcodes + content inbetween `vc_raw_html` tags from search result excerpt **/
    add_filter(‘relevanssi_pre_excerpt_content’, ‘rlv_shortcode_blaster’);
    function rlv_shortcode_blaster($content) {
    $content = preg_replace(‘/[(vc_raw_html).*?].*?[/1] ?/’, ”, $content);
    $content = preg_replace(‘/[.*?]/s’, ”, $content);
    return $content;
    }

    Reply

  16. Hi, all

    I developed a plugin to Easily Remove Unused, Broken Shortcodes from any theme (Divi, Avada, ..etc) or a plugin.

    Video demo: https://www.youtube.com/watch?v=dXVZ5bSUduc
    The plugin site: https://plugins.jozoor.com/shortcode-cleaner/

    The plugin named ( Shortcode Cleaner )
    which it removes unused, broken shortcodes from WordPress, so you can switch between themes and plugins without worrying and keep your content cleanly and fresh all the time, it is dealing with any theme (Divi, Avada, ..etc) shortcodes that are left when changing themes or plugins.

    I think it will be useful for any site.

    Reply

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.