Shorttag to show/hide app specific content

[gerhardsletten]

Would a shorttags for showing / hiding content in a post/page be good idea? Probably also to target specific platforms like ios or android?

[blupu]

We plan to add shorttags to embed alternative content for mobile (notably when it uses Flash). Is that what you have in mind?

[gerhardsletten]

Hi, I was thinking more that if you reuse wordpress pages both in the website and for the app, it would be nice to adjust the output based on where you consume it.

My use case now, where a parent site where the site owner had added internal links to sub-pages in the content of the page, but in the app you would rather use the "List subpages option".

You could add a special css-class "hide-in-app" and wrap that content with it, and then add a css rule in the apps theme to not display that. But a more user-friendly what would be to have a set over shortcodes to show / hide different part of the page-content. The code code could be somethink like this:

<?php 
add_shortcode( 'hide_app', 'shorttag_hide_app' ); 
function shorttag_hide_app( $atts, $content ) {
  if ( is_app() ) { // is_app() = some kind of function to check it content is generated for the app
    return '';
  }
  return $content;
}

add_shortcode( 'only_app', 'shorttag_only_app' ); 
function shorttag_only_app( $atts, $content ) {
  if ( is_app() ) {
    return $content;
  }
  return '';
}
?>

[blupu]

Good point. It could be a nice feature indeed. So I believe the shortcodes would only interpreted when data are retrieved through the WP-AppKit API. @mleroi do you see a way to do the is_app()?
Regarding the shorcodes themselves, I would probably have something like hide_from_apps and show_in_apps_only to be as explicit as possible.

[mleroi]

Yes is_app() is totally doable, we don't have a dedicated function to do that yet but it can totally be integrated to v0.6 for example.

I made a quick test with the shortcodes implemented as above and defining is_app() like so:

function is_app() {
    return !empty( WpakWebServiceContext::$current_app_id );
}

It works like a charm :)

[blupu]

Great news :-) It will be integrated in 0.6.

[blupu]

We may have to consider the following: hide_from_apps and show_only_in_apps will strip content. In other words, a content fragment tagged with hide_from_apps will never reach the app itself. It will be deleted from content before the data are returned to apps. However, sometimes we need to signal that a content was there and can't be displayed in the app. It will allow to style a placeholder saying content unvailable (for example).

So I propose to have a notify attribute for the hide_from_apps shortcode with a true|false values or yes|no values. The default value will be false|no (meaning the tagged content is simply stripped and that the app doesn't know about it).

If set to true|yes, the content will be replaced by an empty div with a dedicated CSS class (eg. smt-content-not-available).

[mleroi]

Shortcodes created:

• [show_only_in_apps]content[/show_only_in_apps]
• [hide_from_apps notify="yes/no"]content[/hide_from_apps](notify is optional)

I'm wondering if show_only_in_apps could not be named only_in_apps (when making tests I found show_only_in_apps a bit long to write for a shortcode name). But tell me what you think!

Any test/feedback on this is welcome!

[blupu]

@mleroi I've tested shortcodes and they work.

However, I think, we should enhance their outputs. [show_only_in_apps] and [hide_from_apps] should be able to return their content in <p> tags. (Not always as we might want to show/hide inline content.)

To match this new behavior, I would output a <p> by default for .wpak-content-not-available. If we have a mechanism to set output as inline elements, then .wpak-content-not-available can be returned as <span>.

Maybe the easiest way is to have a container attribute whose value is the surrounding tag (eg. span, p, div...). If the container attribute is not set, the default value is <p> (ie. block).

What do you think of that?

[mleroi]

Defaulting to <p> and having a container attribute seems a good idea indeed.
I'll add that :)

[mleroi]

@blupu I've added the container attribute.
<p> by default and can be set to any html tag, or set to "none" to display no wrapper (as it was before).
New usages:
[show_only_in_apps container="p|span|div|none"]content[/show_only_in_apps]
[hide_from_apps notify="yes|no" container="p|span|div|none"]content[/hide_from_apps]

[blupu]

@mleroi what if I don't have a container attribute?

[mleroi]

@blupu if no container attribute then container defaults to <p>

[blupu]

✨

[mleroi]

Here's the doc section about those 2 shorcodes "show_only_in_apps" and "hide_from_apps": http://uncategorized-creations.com/wp-appkit/doc/app-content/#2721-shortcodes