Question: have an interesting conundrum. I need to load about 8 javascript files and the same number of styles for my plugin. These are only needed where ever my shortcode is ran.

I've tried to load them with print\_styles and print\_scripts but they aren't rendering properly, plus to do so breaks xhtml validation. So at the moment they load on every page and due to the number of files needed its not feasible to leave it like this. 

On another project I wrote a function into my plugin's index.php file that would take the current page, search it for my shortcode and if found only then would it print the scripts, but this is an ugly hack.

Has anybody got any suggestions or solutions?
any help would be appreciated,
regards,
Daithi

Answer: 
Loading Scripts and Styles Dynamically Per Page Using a Shortcode
-----------------------------------------------------------------

### Advantages

* **Does not search through all the posts everytime the shortcode is called.**
* Able to add styles as well as scripts dynamically only when shortcode is on the page.
* Does not use regexes since they tend to be slower than `strstr()` or `strpos()`. If you need to pickup args then you should use the shortcode regex mentioned above.
* Reduces file calls

### Explanation of Code

1. Finds the shortcodes on page using the `save_post` hook only when the post is not a revision and matches the specified `post_type`.
2. Saves the found post ids as an array using `add_option()` with autoload set to yes unless the entry is already present. Then it will use `update_option()`.
3. Uses hook `wp_enqueue_scripts` to call our `add_scripts_and_styles()` function.
4. That function then calls `get_option()` to retrieve our array of page ids. If the current `$page_id` is in the `$option_id_array` then it adds the scripts and styles.

**Please note:** I converted the code from OOP Namespaced classes so I may have missed something. Let me know in the comments if I did.

### Code Example: Finding Shortcode Occurences

```
function find_shortcode_occurences($shortcode, $post_type = 'page')
{
    $found_ids = array();
    $args         = array(
        'post_type'   => $post_type,
        'post_status' => 'publish',
        'posts_per_page' => -1,
    );
    $query_result = new WP_Query($args);
    foreach ($query_result->posts as $post) {
        if (false !== strpos($post->post_content, $shortcode)) {
            $found_ids[] = $post->ID;
        }
    }
    return $found_ids;
}

function save_option_shortcode_post_id_array( $post_id ) 
{
    if ( wp_is_post_revision( $post_id ) OR 'page' != get_post_type( $post_id )) {
        return;
    }
    $option_name = 'yourprefix-yourshortcode';
    $id_array = find_shortcode_occurences($option_name);
    $autoload = 'yes';
    if (false == add_option($option_name, $id_array, '', $autoload)) update_option($option_name, $id_array);
}

add_action('save_post', 'save_option_shortcode_id_array' );

```

### Code Example: Shortcode Dynamically Include Scripts and Styles

```
function yourshortcode_add_scripts_and_styles() {
    $page_id = get_the_ID();
    $option_id_array = get_option('yourprefix-yourshortcode');
    if (in_array($page_id, $option_id_array)) {
        wp_enqueue_script( $handle, $src, $deps, $ver, $footer = true );
        wp_enqueue_style( $handle, $src , $deps);
    }
}

add_action('wp_enqueue_scripts', 'yourshortcode_add_scripts_and_styles');

```
You can just use this code to check if the shortcode is implemented in page content or in sidebar widgets.

```
<?php

if ( shortcode_exists( 'gallery' ) ) {
    // The [gallery] short code exists.
}

?>

```