Updated WordPress Requirements

themeforest
codecanyon
elements
envato-hosted

#147

@StephenCronin Translation for Backend required?


#148

@StephenCronin

From WordPress Theme Plugin Requirements:

Included third-party plugins do not need to meet these requirements, but theme-specific plugins must meet the WordPress Plugin Requirements.

From WordPress Plugin Requirements:

Inline CSS styles are not allowed in the markup.

When shortcodes have options to change element styling, how are we to add dynamic styling when by the time shortcodes are parsed wp_head has already run. We cannot add styles to the footer, only option is to add them inline. Many plugins are doing it this way, even Gutenberg is adding inline styles.


#149

Wait? What?

Inline CSS styles are not allowed in the markup.

But how are we supposed to give the client style options for styling an specific element? Let’s say, to change the color of it, how can we do that without inline style?


#150

You don’t need inline CSS:

/**
 * Check the current post content for [example] shortcode.
 */
add_action( 'wp_enqueue_scripts', function() {
    global $post;
    if ( is_a( $post, 'WP_Post' ) && has_shortcode( $post->post_content, 'example') ) {
        // ... do your logic here
        // $custom_css = '.example{ color: #aaa }';
        // ...
        // wp_add_inline_style( 'custom-style', $custom_css );
    }
} );

That’s something else. You must not attach inline styles to an element, but you are allowed to add them to the header with wp_add_inline_style(): https://help.author.envato.com/hc/en-us/articles/360000479946#h_7520408803181522300441040


#151

Aha! So, let’s say the client add 4 indentical shortcodes on a page, but he wants to change the color and the background for two of them. How is this is going to help me to achieve that, since this add the css to a specific tag/class global not only for that single element.

div{ color: red; } is not equal with

. (no, to use a class is not a solution since the effect will be the same )

#152

Then you are doing_it_wrong. You should not allow custom CSS to be added directly to the shortcodes as parameters. But even if you do so, there are always possibilities to do it right. First what comes in my mind right now would be a regex: "find all shortcodes, assign an id, get the attributes and using the new ID, embed the styles in </head>".

Remember, here are so many freelancers that buy ‘ready-made’ themes. They usually modify these themes a lot. Inline CSS makes hard to do some changes without modifying the source code.(generally speaking)


#153

Regex are slow in PHP. For my clients to have these options is the best since only few of them really change the core code or the layout of theme and they only change a specific color / or bg

This requirement should be rethink.


#154

We may try to ask add ‘color’ and ‘background-color’ CSS rules as an exceptions for inline styles? Same as a ‘background-image’.
Also there is a ‘width’ property - for WooCommerce stars rating and Bootstrap ‘progress’ components. It is a good idea to add them as an exceptions also.
If these exceptions will not be allowed, then We’ll be print those values via data attributes, catch them in JavaScripts and again, add them to the inline styles. But this is insanity.


#155

This is the way I go…
I have a doubt that will be accepted but I wasted way to much time trying to find a way to do it a “right” way.
Or is this, or I’ll cut off the idea of customization for my themes and the end user will have do write the css by themselves.

And I got this on my other account on an soft-reject.

  1. Scripts and styles should not be hardcoded anywhere in your theme or added any other way but with wp_enqueue_* hook and to be added from the functions file. This includes custom JS/CSS.
    For inline styles use: https://developer.wordpress.org/reference/functions/wp_add_inline_style/ and for scripts https://developer.wordpress.org/reference/functions/wp_add_inline_script/

How can I use wp_add_inline_style() in a shortcode? Is there any other method to let me give the end user a easy option to customize the theme easily?

So, how am I supposed to give the end user the ability to customize some of the shortcode elements? Like a color for a paragraph or add some margin? Most of my clients depends on those kind of things.

I don’t know if this is the correct to post this, but since is has to do with the inline style rule for plugins, I think this deserve more to discuss on it.


#156

You can run the wp_add_inline_style function within the shortcode action, just call the function e.g. (not tested)

function myfunctionname( $atts ) {
 $atts = shortcode_atts(
  array(
   'color' => '#000',
  ),
  $atts,
  'shortcode'
 );
 
 wp_enqueue_style(
  'custom-style',
  get_template_directory_uri() . '/css/custom_script.css'
 );
 $color = $atts['color'];
 $custom_css = "
  .mycolor{
   background: {$color};
  }";
  wp_add_inline_style( 'custom-style', $custom_css );
}
add_shortcode( 'shortcode', 'myfunctionname' );

#157

That won’t work.
Styles must be enqueued in the <head> and when the shortcode runs it is too late.


#158

Sounds good, if im understanding is right de-clutter and remove old themes making a better user experience for the buyer. Thats a lot of theme reviewing!


#159

Dear Sir , I have some warning when using the latest version of envato theme check
WARNING: Found add_meta_boxes in the file framework/metabox/wd_custom_fields.php. Custom meta box functions are allowed for design only. Ensure this is a valid use case.
Line 18: add_action(‘add_meta_boxes’, array($this,‘generate_customfields’));

WARNING: Found add_meta_box in the file framework/metabox/wd_custom_fields.php. Custom meta box functions are allowed for design only. Ensure this is a valid use case.
Line 18: add_action(‘add_meta_boxes’, array($this,‘generate_customfields’));
Line 54: add_meta_box($meta_box[‘id’], $meta_box[‘title’], $meta_box[‘callback’], $m

So with this warning , I have to need fix it because I’m using a lot of add_meta_box


#160

I can’t update my WP themes because there is no proper explanation about Gutenberg on forums. I asked a question here

and nobody answered.

Is anyone willing to help me with that question?

@jamesgiroux ?


#161

What about sanitization? Is it safe enough to print the style this way?


#162

as far as I am aware you can, WP lets you use sanitization functions in the function so you can do something like:

$mycss = esc_attr( $atts[‘color’] );


#163

But on WordPress Codex page they inform that it’s not 100% secure:

You can use wp_kses( $data, array( “’”, ‘"’ ) ); or wp_strip_all_tags( $data ); or esc_html( $data ); but this is NOT 100% secure.

Source - https://codex.wordpress.org/Function_Reference/wp_add_inline_style


#164

If you want more secure CSS then I would suggest to look at that https://github.com/mattrude/Custom-CSS/blob/master/safecss.php#L687

This a good question as serious XSS attacks can happen from CSS also Cross Domain attacks can happen from your CSS with many other possible attacks that’s includes stealing information, Tracking, Hijacking trojans.


#165

Can i use theme specific shortcodes in theme file?

@jamesgiroux ?


#167

No, all shortcodes have to be registered in a plugin