# WP-discourse: how to deal with shortcodes in post

**URL:** https://meta.discourse.org/t/wp-discourse-how-to-deal-with-shortcodes-in-post/58838
**Category:** WordPress
**Created:** [March 10, 2017, 5:15pm UTC](https://meta.discourse.org/t/wp-discourse-how-to-deal-with-shortcodes-in-post/58838 "2017-03-10T17:15:03Z")
**Posts on this page:** 10
**Page:** 1

<div class="post-metadata">

### Author: ![tophee](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tophee/32/73406_2.png) [@tophee](https://meta.discourse.org/u/tophee)
#### Post date: [March 10, 2017, 5:15pm UTC](https://meta.discourse.org/t/wp-discourse-how-to-deal-with-shortcodes-in-post/58838/1 "2017-03-10T17:15:03Z")

</div>

I noticed that what WP-discourse is publishing to Discourse are the raw texts from the WordPress posts, not the rendered html. And I guess that makes some sense, given how complex wordpress pages can be. But it’s also a problem since it means you can’t use any shortcodes (or you can’t use discourse with the posts where you do)…

Is there any workaround for this?

Are there any plans of maybe providing an option to use the rendered html as the basis for the discourse post?

---

<div class="post-metadata">

### Author: ![simon](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/simon/32/339122_2.png) [@simon](https://meta.discourse.org/u/simon)
#### Post date: [March 10, 2017, 5:36pm UTC](https://meta.discourse.org/t/wp-discourse-how-to-deal-with-shortcodes-in-post/58838/2 "2017-03-10T17:36:35Z")

</div>

Take a look at the ‘Dealing with WordPress shortcodes’ section of this topic: [WP Discourse plugin tips and tricks](https://meta.discourse.org/t/wp-discourse-plugin-tips-and-tricks/50757)  
The `do_shortcode` option that’s given in that topic generally doesn’t work, but I think some changes could be made to the plugin to get it working.

---

<div class="post-metadata">

### Author: ![tophee](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tophee/32/73406_2.png) [@tophee](https://meta.discourse.org/u/tophee)
#### Post date: [April 6, 2017, 12:06am UTC](https://meta.discourse.org/t/wp-discourse-how-to-deal-with-shortcodes-in-post/58838/3 "2017-04-06T00:06:11Z")

</div>

I solved this by circumventing the content of the post and merely exporting the post url via the plugin while making sure that it will be oneboxed, like this:

> [@WP Discourse plugin tips and tricks](https://meta.discourse.org/t/wp-discourse-plugin-tips-and-tricks/50757/3):
>
> You can edit the ‘publish\_format’ template so that your published WordPress posts are oneboxed. Look at this post for details: [Customize the structure of WP Discourse templates - #6](https://meta.discourse.org/t/wp-discourse-template-customization/50754/6)

---

<div class="post-metadata">

### Author: ![simon](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/simon/32/339122_2.png) [@simon](https://meta.discourse.org/u/simon)
#### Post date: [April 15, 2017, 2:47am UTC](https://meta.discourse.org/t/wp-discourse-how-to-deal-with-shortcodes-in-post/58838/4 "2017-04-15T02:47:38Z")

</div>

For posts where you need the shortcode content to be published to Discourse, it’s possible to publish the post in an iframe. This works best if the WordPress posts uses a custom post-type. That way you can decide which posts are to be published in an iframe. It takes a bit of work on the WordPress end so that posts are published in a format that’s suitable for putting in an iframe. **You also need to be able to whitelist the iframe on Discourse for this to work**.

I’ve been testing this with both an image gallery shortcode, and a groups sign-up form. It seems to be working quite well.

```plaintext
function your_namespace_publish_format_html( $output ) {
    global $post;

    if ( 'my_iframe_post_type' === $post->post_type) {
	ob_start();

	?>
    <iframe width="690" height="600" src="<?php echo esc_url( the_permalink() ); ?>" frameborder="0"></iframe>
	<?php
	$output = ob_get_clean();

	// Return an iframe for this post type.
	return $output;
    }

    // Return the default output, or do something else with it here.
    return $output;
}
add_filter( 'discourse_publish_format_html', 'your_namespace_publish_format_html' );

```

---

<div class="post-metadata">

### Author: ![jrgong](https://avatars.discourse-cdn.com/v4/letter/j/c57346/32.png) [@jrgong](https://meta.discourse.org/u/jrgong)
#### Post date: [September 8, 2019, 11:25am UTC](https://meta.discourse.org/t/wp-discourse-how-to-deal-with-shortcodes-in-post/58838/5 "2019-09-08T11:25:46Z")

</div>

Hey @simon

I used your template to customize the `discourse_publish_format_html` to display all posts in an iframe. However, the src parameter of the iframe output is empty. See here:

[https://forum.cannabisanbauen.net/t/ist-meine-pflanze-maennlich-was-tun/7196](https://forum.cannabisanbauen.net/t/ist-meine-pflanze-maennlich-was-tun/7196)

**Any idea why?** Below is my code:

```plaintext
// show post in iframe 
function your_namespace_publish_format_html( $output ) {
    global $post;
    ?>
    <iframe width="690" height="2000" src="<?php echo esc_url( the_permalink() ); ?>" frameborder="0"></iframe>
    <?php
    $output = ob_get_clean();

    // Return the default output, or do something else with it here.
    return $output;
}
add_filter( 'discourse_publish_format_html', 'your_namespace_publish_format_html' );

```

---

<div class="post-metadata">

### Author: ![simon](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/simon/32/339122_2.png) [@simon](https://meta.discourse.org/u/simon)
#### Post date: [September 12, 2019, 4:18pm UTC](https://meta.discourse.org/t/wp-discourse-how-to-deal-with-shortcodes-in-post/58838/6 "2019-09-12T16:18:44Z")

</div>

You might need to use the post\_id to get the permalink. Can you check if something like this works?

```php
add_filter( 'discourse_publish_format_html', 'wpdc_custom_discourse_publish_format_html', 10, 2 );
function wpdc_custom_discourse_publish_format_html( $output, $post_id ) {
    $permalink = get_the_permalink( $post_id ) . '?embed=true';
    ob_start();
	?>
    <iframe width="690" height="600" src="<?php echo esc_url( $permalink ); ?>" frameborder="0"></iframe>
	<?php

	return ob_get_clean();
}

```

---

<div class="post-metadata">

### Author: ![jrgong](https://avatars.discourse-cdn.com/v4/letter/j/c57346/32.png) [@jrgong](https://meta.discourse.org/u/jrgong)
#### Post date: [September 27, 2019, 8:00am UTC](https://meta.discourse.org/t/wp-discourse-how-to-deal-with-shortcodes-in-post/58838/7 "2019-09-27T08:00:41Z")

</div>

It worked well! thx again for the support

@simon

Now I want to add the post text hidden in the topic so that it will be found by the search function and properly scraped by search engine crawlers.

What changes to I have to make to my current code below to put a `<div style="display:none;">...</div>` with the post content?

```plaintext
// Removes anything that looks like a shortcode. This will remove anything in the post that
// occurs inside of brackets `[...]`.
add_filter( 'wp_discourse_excerpt', 'testeleven_remove_shortcodes' );
function testeleven_remove_shortcodes( $excerpt ) {
    $excerpt = preg_replace( '/\[.*\]/', '', $excerpt );

    return $excerpt;
}
// show wp posts embedded in discourse via iframe
// https://meta.discourse.org/t/wp-discourse-how-to-deal-with-shortcodes-in-post/58838/5
add_filter( 'discourse_publish_format_html', 'wpdc_custom_discourse_publish_format_html', 10, 2 );
function wpdc_custom_discourse_publish_format_html( $output, $post_id ) {
    $permalink = get_the_permalink( $post_id );
    ob_start();
	?>
    <iframe width="690" height="2000" src="<?php echo esc_url( $permalink ); ?>" frameborder="0"></iframe>
	<?php

	return ob_get_clean();
}

```

---

<div class="post-metadata">

### Author: ![simon](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/simon/32/339122_2.png) [@simon](https://meta.discourse.org/u/simon)
#### Post date: [September 30, 2019, 5:28pm UTC](https://meta.discourse.org/t/wp-discourse-how-to-deal-with-shortcodes-in-post/58838/8 "2019-09-30T17:28:22Z")

</div>

> [@jrgong](#):
>
> Now I want to add the post text hidden in the topic so that it will be found by the search function and properly scraped by search engine crawlers.

You can hide the post’s text with CSS by targeting a `data` attribute in your Discourse site’s theme. On WordPress, wrap the post excerpt in a div with a `data` attribute set to something like `data-hide="true"`:

```php
add_filter( 'discourse_publish_format_html', 'wpdc_custom_discourse_publish_format_html', 10, 2 );
function wpdc_custom_discourse_publish_format_html( $output, $post_id ) {
	$permalink = get_the_permalink( $post_id ) . '?embed=true';
	ob_start();
	?>
    <div data-hide="true">{excerpt}</div>
    <iframe width="690" height="600" src="<?php echo esc_url( $permalink ); ?>" frameborder="0"></iframe>
	<?php

	return ob_get_clean();
}

```

On Discourse, add something like this to your theme:

```css
[data-hide="true"] {
    display: none;
}

```

I’m not sure how well this will work for SEO, but using a `data` attribute is a good way to add styles to posts that are published from WordPress.

---

<div class="post-metadata">

### Author: ![jrgong](https://avatars.discourse-cdn.com/v4/letter/j/c57346/32.png) [@jrgong](https://meta.discourse.org/u/jrgong)
#### Post date: [September 30, 2019, 6:11pm UTC](https://meta.discourse.org/t/wp-discourse-how-to-deal-with-shortcodes-in-post/58838/9 "2019-09-30T18:11:49Z")

</div>

Doesn’t this template just add the excerpt instead? Or does the [WP Discourse](https://github.com/discourse/wp-discourse) “display full post” setting display the full post for `{excerpt}` placeholder?

---

<div class="post-metadata">

### Author: ![simon](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/simon/32/339122_2.png) [@simon](https://meta.discourse.org/u/simon)
#### Post date: [September 30, 2019, 6:15pm UTC](https://meta.discourse.org/t/wp-discourse-how-to-deal-with-shortcodes-in-post/58838/10 "2019-09-30T18:15:10Z")

</div>

The `excerpt` placeholder is always used. If you select the ‘display full post’ setting, the full post will be substituted for the placeholder.