Comic Embedder

The Chick Comic Embeder plugin enables a shortcode that lets you share the Gospel with your user’s by embeding Jack Chick’s great comic tracts in your WordPress posts and pages. Like this:

[chickcomic]

There are three optional parameters that you can set when you use the shortcode in your pages and posts. Below are some examples. For a complete list of options, you can visit the plugin’s settings page once it is installed. You can also set the default behavior of the shortcode there.

  1. 'comic' – Use this parameter to tell the shortcode what comic to display. For example, [chickcomic comic="1"] or [chickcomic comic="unloved"] or [chickcomic comic="random"]
  2. 'unavailable' – Use this parameter to tell the shortcode what to do if the specified comic is unavailable. (The availability of the comics is subject to change, and is outside of the plugin author’s control). Example: [chickcomic comic="1" unavailable="none"] will cause the shortcode to display nothing if the comic becomes unavailable.
  3. 'style' – Use this parameter to tell the shortcode how you want the comic displayed. For example, if you want it on the left with the other content wrapped around it, use [chickcomic comic="1" style="wrap-left"].

Of course, all of these are optional, and you can just use the basic shortcode with no parameters ([chickcomic]), and the defaults will be used.

 

Custom Styles

There are four different styling options included in the plugin, but you can create your own styles if you know CSS, and PHP.

First create your CSS rules for a new class, and add them to your child theme’s style.css file. (If you aren’t using a child theme, now’s the time to start). In this example, out class will be black-border.

.chickcomic-container.black-border {
	border: 2px solid #000;
}

In this rule, .chickcomic-container tells the browser we want to apply these styles to the comic container. Appending your own style (in this case, .black-border) to that, tells the browser we only want to apply the rule to the comic container when it also has the black-border class. (Don’t put any spaces between these!) You can use any sort of styling you want, and can even override the default styles if you wish.

If you want to be able to set your new style as the default, and/or preview it on the style preview page, you need to add some code to your child theme’s functions.php:

<?php

/**
 * A new function for our custom styles.
 *
 * It needs to take one parameter; this is the array of styles.
 *
 * @filter chickcomic_styles_filter
 *
 * @param array $styles The array of styles.
 *
 * @return array An array of styles.
 */
function function_for_my_custom_styles( $styles ) {

	/* Add a new element to the array of styles.
	 * Make sure that the [key] matches the new class you added in the CSS.
	 * The value is the name of your style, and can be whatever you want.
	 */
	
	$styles['black-border'] = 'My Black Border Style';

	/* You can add as many as you want here.
	 * Just copy the above line, and change it to match another style you've created.
	 */
	
	// If you don't return the $styles array, then no styles will work!
	return $styles;
}
add_filter( 'chickcomic_styles_filter', 'function_for_my_custom_styles' );

// ^^ We tell WordPress that we want add this function as a part of the chickcomic_styles_filter.

?>

Basically you need to create a function to filter the array of styles, and create a new entry in the array for your new style.

 

Embedding the comics without shortcode

You can embed comics in posts and pages with the shortcode, but what if you want to do something else, like display a random comic in the footer of your website? You can do that using the display_chickcomic() function. This is the function that the shortcode uses to display the comics. The function takes the same three parameters as the shortcode, the only difference being that they must be in order:

  1. The id or title of a comic, or 'latest' or 'random'.
  2. What to display if the comic is unavailable: 'none', 'default', 'random'.
  3. What style to give the comic.

As with the shortcode, these are all optional, and if they aren’t set the defaults will be used. So you could call the function like this, with no parameters:

display_chickcomic();

Or will all parameters:
display_chickcomic( '1', 'none', 'inset-box' );

If you want to leave out a parameter, but set a later parameter, then just pass NULL:

display_chickcomic( 'random', NULL, 'inset-box' );

You can use this function anywhere in your PHP code. The function returns a string, which you will have to echo() to display the comic. For example:

echo( display_chickcomic() );

One example of its use would be to display a random comic at the bottom of each of your posts. Example code:

<?php

/**
 * Filter the post content and add a comic to the bottom of the page.
 *
 * @filter the_content Post content filter.
 *
 * @param string $content The post's content.
 *
 * @return string The post's content.
 */
function append_tract_single_posts( $content ) {

	// If we are displaying a single post on a page.
	if ( is_single() ) {

		// We append a random comic to it.
		$content .=  display_chickcomic( 'random' );
	}

	// Then we return the content.
	return $content;
}
add_filter( 'the_content', 'append_tract_single_posts' );

?>

Once you have added this to your child theme’s functions.php, or wrapped it in a plugin, a random comic will automatically be displayed at the bottom of each of your posts, when they are viewed as a single post.

Feedback

I tried to make this plugin as good as possible. But I know it isn’t perfect. If you have a comment, question, or suggestion, feel free to leave a comment below.

Leave a Reply

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