Category Archives: Manual Version 0.9.6.x

Resources

There are additional resources available online to help you create Ryuzine  publications.

Official Online Resources

Ryuzine Press Plugin:Download Version 0.9.6.6
Ryuzine Package (for Ryuzine Press):Download Version 0.9.6.6
User Forums:http://www.ryumaru.com/forum
Add-On Project Pages: 
OVR Player
iScroll 4

There is also a “stand-alone” version of Ryuzine that does not require WordPress.  It uses our own “Ryuzine Writer” authoring webapp which is available in a free download as part of our Publisher Distribution Kit (PDK).

Media Query Test Page

http://www.kmhcreative.com/downloads/MQ.htm

CSS3 to SVG Gradient Background Utility:

http://www.kmhcreative.com/downloads/CSS2SVG.htm

Additional WordPress Resources

WordPress Download

ComicPress Version 2.9
ComicPress Manager Plugin
ComicPress Theme Companion Plugin

Comic Easel Plugin

Webcomic Theme

Compatibility

Ryuzine Press Plugin

The Ryuzine Press plugin is compatible with WordPress version 3.0 and later and ComicPress 2.9, Easel 2.0.7 (with Comic Press Lite), Comic Easel 1.0, Webcomic 3.0.10 and later.  It will not work with earlier versions.

Ryuzine WebApp System Requirements

The Ryuzine WebApp is intended for high-end mobile devices and modern desktop computers. Devices that experience severe lag or other usability errors are advised to switch to “Continuous” or “HTML Only” alternative views, which require a lot less resources.

Ryuzine Reader:

Earlier releases of Ryuzine attempted to be as broadly compatible as possible. However with our limited resources it proved untenable to be testing and debugging multiple webapps for so many browsers and platforms. Starting with version 0.9.6.0 we shifted to a smaller, more focused, list of browsers and devices we’d actively strive to support:

  • iOS 5+
  • Android 4.x
  • Mac OSX 10.6+
  • Windows 7
  • Windows 8 (including “Metro/Modern” mode)
  • Linux (kernel 2.6+ recommended)
  • Windows Phone 7.5+
  • Apple Safari 5+
  • Apple Safari Mobile (in iOS 5+)
  • Google Chrome 20+
  • Mozilla Firefox 12+
  • Microsoft Internet Explorer 9+
  • Microsoft Mobile Internet Explorer 9+

The Ryuzine webapps continue to work with some of the older versions of those operating systems and browsers as well, but we are choosing to focus on the current, most used, and next versions rather than “legacy” versions that are (or should be) falling out of use.

Ryuzine Web App Compatibility Chart:

Version Grade Adjust Anim. Themes
Internet Explorer (Windows)
< 9 F N N N
9 C Y L Y
10 A Y Y Y
Mobile Internet Explorer (Windows Phone 7.5)
9 C Y L Y
10 A Y Y Y
Firefox (Windows, Mac, Linux)
1.5-3.5 D N L N
3.6 C N L Y
4+ B Y Y Y
Safari (Windows, Mac)
3.04 F N N N
4.05 A Y Y Y
5.x A Y Y Y
Mobile Safari (iOS 4+)
4 A Y Y Y
5 A Y Y Y
Chrome (Windows, Mac, Linux)
10-19 B Y Y Y
20+ A Y Y Y
Android Browser
2.3.x “Gingerbread” C Y L Y
3.x “Honeycomb” B Y Y Y
4.x “ICS” B Y Y Y
4.1.x “Jelly Bean” B Y Y Y
Legend:

A = Fully Works
B = Performance Issues
C = Legacy Animations
D = Reduced Functions
F = Unusable

Y = Yes
N= No
L = Legacy Animation
? = Untested/Unknown

Dropped Support

We officially dropped support for Internet Explorer version 8 and earlier and Safari version 3 and earlier. To that end over 500 lines of code was removed from Ryuzine Reader related to supporting those older browsers and the “legacy_ie” add-on is no longer being supported nor included. If supporting those legacy browsers is important to you do not upgrade your publications.

Support for Opera browsers was also dropped (both desktop and mobile versions). The release of Opera 12, which includes some fairly strict security measures, broke a number of Ryuzine features. After spending too much time trying to work around the changes we had to re-assess whether or not it was worth spending so much time and effort accommodating a browser with such a small user-base and regrettably had to dedicate our limited development resources to more popular platforms.

+Comic Easel

Comic Easel is a new WordPress plugin from ComicPress code developer, Philip M. Hofer (aka “Frumph”).  It is the successor to the ComicPress plugin, but offers more features, better theme integration, and is more actively developed.

Unlike ComicPress, however, Comic Easel uses its own “Chapters” system that is independent of the WordPress post categories.  This makes it impossible to assign Comic Easel comic posts to a Ryuzine Press Edition.

Version 0.9.6.6 UPDATE:

This version introduces a custom “Ryuzine Issues” taxonomy and attempts to automatically enable this for the Comic Easel plugin so you can assign a comic post to a Ryuzine Issue simply by selecting it in the meta-box on either the comic post edit page or on the bulk management page.  The hacks below should no longer be necessary and updates to Comic Easel will no longer disable comic posts from appearing in Ryuzine Press Editions.

UPDATE: Experimental Auto-Fix

The latest version of the Ryuzine Press plugin detects whether or not the Comic Easel plugin is activated, and if it is, attempts to enable the regular “Category” options for Comic Easel posts as well.  However, this may not work if Comic Easel initializes after Ryuzine Press and doesn’t work if you’ve changed the custom post-type name in the Comic Easel settings.  If the regular “Category” list isn’t available for Comic Easel posts you will need to do the manual hack outlined below.

Manual Hack to Comic Easel

Once you have the Comic Easel plugin installed go into the ~/wp-content/plugins/comic-easel/comiceasel.php file, and around line 58 find:

‘taxonomies’ => array( ‘post_tag’ ),

and change it to:

‘taxonomies’ => array( ‘category’,’post_tag’ ),

UPDATE: In that same file if you scroll down to about line 153 you’ll see a line that is commented out:

// register_taxonomy_for_object_type(‘category’, ‘comic’);

Simply remove the // from the beginning and update the file.  If you do this you don’t have to do the edit above.

Now, when you go to Comics > Comics and click on a Comic Easel comic post you should see the normal WordPress Category list with checkboxes on the right-hand side of the Edit page.

IMPORTANT: Updates to the Comic Easel plugin will overwrite this hack and you will need to re-do it every time the Comic Easel plugin is updated.

Assigning Comics to Editions

Once your comic posts are in place, and you’ve hacked the Comic Easel file, assigning them to a Ryuzine Press Edition is as simple as categorizing any regular blog posts – in fact you can mix them in the same edition.  Create your Ryuzine Press Edition and assign it to an existing Ryuzine Issue (or create an issue entry specifically for this Edition).  Then simply go to Comics > Comics and find the comics you want to assign in the list.  Using the “Edit” link open the comic post and look for the “Ryuzine Issues” list on the right.  If it isn’t there you may need to go to “Screen Options” at the top and enable it.  Once you’ve got it, tick the box for the Issue corresponding with the Ryuzine Press Edition.

Do the same for all the comics and/or blog posts you want to assign to the edition, remembering they will be displayed oldest to newest.  This is usually the preferable order since most people using Webcomic to post ongoing stories will have posts in that chronological order, and the WordPress archive pages usually show them newest to oldest, but in “comic reading order” they need to be oldest to newest.

Note that this all works much better if you are posting comic PAGES rather than comic STRIPS.  If your work is in strip format you may want to consider creating images with multiple strips and posting them as “pages” or there may be a lot of white space below a relatively small bit of artwork.

If you are switching from Webcomic or ComicPress to Comics Easel you can actually have them activated at the same time and Ryuzine Press Editions can simultaneously display mixed comic posts from both comic platforms.

Covers & Pages

If you want to use the oldest post assigned to an Edition as the cover you will need to configure “Cover Source” under Ryuzine Press > Options > Covers.  Realize that this is a global setting affecting ALL your Ryuzine Press Editions.

Under the “Pages” tab you can also decide whether or not to show or hide bylines and dates, meta data, and/or comments.  There is also an option specific to comic posts that will suppress any related post text.  Use this option if you want a cleaner appearance more like reading a real comic book.

You can also add Issue-Specific styling to the Ryuzine Press Edition (in the last custom box) to hide all the headers, leaving just an empty top margin, which makes it look even more like a real comic book.

If you are not using the oldest post for the cover you can use the auto-generated covers.  You may find these are more flexible in that you can have a single image to overlay on all covers as a masthead and use CSS and media queries to place “full-bleed” cover artwork, and you can tag back-up stories or non-comic content with your “featured” category as well and have them automatically turned into clickable links on the cover.

*NEW* You can use the shortcode in your Ryuzine Press Edition and then set it to use the shortcode content in the Options > Covers section on auto-generated covers.  As covered in the “Shortcodes” section of this manual there are also parameters you can include that will determine how the image is applied to the cover.  If you use this option you also do not need to add any CSS code, it is handled automatically.

What about “Easel?”

The first release of the Easel Theme had integrated “ComicPress Lite” options.  Those have since been removed from the theme, which means Ryuzine Press handles the Easel theme just like any other theme.  If you are publishing webcomics you’ll need to use one of the supported plugins.

+Webcomic

Webcomic is another popular WordPress plugin for creating and managing web comics.  After downloading, installing, and activating the Webcomic plugin you will see a new admin menu item named “Webcomic” appear.  In Ryuzine Press it doesn’t matter if you are using a Webcomic-compatible theme or if you have ticked the “Integrate” option in the Webcomic Settings.  Remember that Ryuzine Press exists alongside of and independently of any WordPress theme you are using.

Assigning Comics to Editions

Once your comic posts are in place assigning them to a Ryuzine Press Edition is as simple as categorizing any regular blog posts – in fact you can mix them in the same edition.  Create your Ryuzine Press Edition and assign it to an existing Ryuzine Issue (or create an Issue specifically for this Edition).  Then simply go to Webcomic > Webcomics and find the comics you want to assign in the list.  Using the “Edit” link open the comic post and look for the “Ryuzine Issues” list on the right.  If it isn’t there you may need to go to “Screen Options” at the top and enable it.  Once you’ve got it, tick the box for the Issue corresponding with the Ryuzine Press Edition.  Note that doing this may unlink the comic image from the post.  If that happens use the “Webcomic” sub-section (below the main post box) to re-link the correct image to the post.

Do the same for all the comics and/or blog posts you want to assign to the edition, remembering they will be displayed oldest to newest.  This is usually the preferable order since most people using Webcomic to post ongoing stories will have posts in that chronological order, and the WordPress archive pages usually show them newest to oldest, but in “comic reading order” they need to be oldest to newest.

Note that this all works much better if you are posting comic PAGES rather than comic STRIPS.  If your work is in strip format you may want to consider creating images with multiple strips and posting them as “pages” or there may be a lot of white space below a relatively small bit of artwork.

If you are switching from either ComicPress or Easel to Webcomic as your platform Ryuzine Press Editions can simultaneously display mixed posts from Webcomic and either ComicPress or Easel.

Covers & Pages

If you want to use the oldest post assigned to an Edition as the cover you will need to configure “Cover Source” under Ryuzine Press > Options > Covers.  Realize that this is a global setting affecting ALL your Ryuzine Press Editions.

Under the “Pages” tab you can also decide whether or not to show or hide bylines and dates, meta data, and/or comments.  There is also an option specific to comic posts that will suppress any related post text.  Use this option if you want a cleaner appearance more like reading a real comic book.

You can also add Issue-Specific styling to the Ryuzine Press Edition (in the last custom box) to hide all the headers, leaving just an empty top margin, which makes it look even more like a real comic book.

If you are not using the oldest post for the cover you can use the auto-generated covers.  You may find these are more flexible in that you can have a single image to overlay on all covers as a masthead and use CSS and media queries to place “full-bleed” cover artwork, and you can tag back-up stories or non-comic content with your “featured” category as well and have them automatically turned into clickable links on the cover.

*NEW* You can use the shortcode in your Ryuzine Press Edition and then set it to use the shortcode content in the Options > Covers section on auto-generated covers.  As covered in the “Shortcodes” section of this manual there are also parameters you can include that will determine how the image is applied to the cover.  If you use this option you also do not need to add any CSS code, it is handled automatically.

+ComicPress

ComicPress posts in a Ryuzine Press Edition, adapting to different screen sizes and orientations on mobile devices.
(Artwork by Jon Sloan, www.sa-bomjimcomic.com) 

The Ryuzine Press Plugin was created from the start with ComicPress integration in mind.  ComicPress is a popular theme system for WordPress which makes it easy to publish and manage a webcomics blog.

Upload your comic pages and (optionally) create a post to go with them as you would normally do with ComicPress.  It is recommended you use ComicPress Manager plugin to help, but is not required.

Assigning Comics to Editions

Once your comic posts are in place assigning them to a Ryuzine Press Edition is as simple as categorizing any regular blog posts – in fact you can mix them in the same edition.  Create your Ryuzine Press Edition and assign it to an existing Ryuzine Issue (or create an Issue specifically for this Edition).  Then simply go to Posts > All Posts and find the comics you want to assign in the list.  Using the “Quick Edit” link and tick the box for the Issue corresponding with the Ryuzine Press Edition.  Do the same for all the comics and/or blog posts you want to assign to the edition, remembering they will be displayed oldest to newest.  This is usually the preferable order since most people using ComicPress to post ongoing stories will have posts in that chronological order, and the WordPress archive pages usually show them newest to oldest, but in “comic reading order” they need to be oldest to newest.

Note that this all works much better if you are posting comic PAGES rather than comic STRIPS.  If your work is in strip format you may want to consider creating images with multiple strips and posting them as “pages” or there may be a lot of white space below a relatively small bit of artwork.

Now some of you may be saying “Wait a minute, wasn’t I told comics can only be in ONE category?”  The comic posts are still in whatever comic-related category to which they belong on your blog and in testing the Ryuzine Press Plugin no problems were encountered by also assigning comic posts to Ryuzine Press Editions.  In fact if you are using ComicPress Manager and go to the “Bulk Edit” section you’ll note that the comics only show their corresponding “storyline” assignments – the Ryuzine Press Edition categories are nowhere to be seen in this list, but they DO appear in the regular “All Posts” list, and you can ONLY assign comics to a Ryuzine Press Edition after they’ve already been published to a storyline/comics category.  However, keep in mind testing was done on  simple sequentially posted image files with the stock ComicPress 2.9 on a single blog site.  No testing was done on Flash-based comics (since they won’t work on many mobile devices anyway), multiple-blog versions of WordPress, or hacked ComicPress files.

As of Ryuzine Press version 0.9.6.6 the WordPress “Categories” are no longer used by your Editions.  If you already had existing Editions there is a Migration Assistant plugin to help you bulk-transfer them to the new taxonomy.  Ryuzine Press now explicitly excludes ComicPress Flash/Motion comics and galleries.  Single pages are the only thing that works.

Covers & Pages

If you want to use the oldest post assigned to an Edition as the cover you will need to configure “Cover Source” under Ryuzine Press > Options > Covers.  Realize that this is a global setting affecting ALL your Ryuzine Press Editions.

Under the “Pages” tab you can also decide whether or not to show or hide bylines and dates, meta data, and/or comments.  There is also an option specific to ComicPress posts that will suppress any related post text.  Use this option if you want a cleaner appearance more like reading a real comic book.

You can also add Issue-Specific styling to the Ryuzine Press Edition (in the last custom box) to hide all the headers, leaving just an empty top margin, which makes it look even more like a real comic book.

If you are not using the oldest post for the cover you can use the auto-generated covers.  You may find these are more flexible in that you can have a single image to overlay on all covers as a masthead and use CSS and media queries to place “full-bleed” cover artwork, and you can tag back-up stories or non-comic content with your “featured” category as well and have them automatically turned into clickable links on the cover.

*NEW* You can use the shortcode in your Ryuzine Press Edition and then set it to use the shortcode content in the Options > Covers section on auto-generated covers.  As covered in the “Shortcodes” section of this manual there are also parameters you can include that will determine how the image is applied to the cover.  If you use this option you also do not need to add any CSS code, it is handled automatically.

WordPress Widgets

List Widget

In previous versions if you wanted to show a list of Ryuzine Press Editions in your blog’s sidebar or footer you had to use a third-party plugin. The one we had been recommending is apparently no longer being developed. So as of versin 0.9.6.6 Ryuzine Press has it’s own custom WordPress widget for displaying a list of Editions. It can also display a link to the Ryuzine Rack Newsstand (if you’ve installed it to the theme).  You’ll find it under:

Appearance > Widgets > Ryuzine Press Editions

Just add it to the sidebar in which you want the list of published Editions to appear.

rp_editions_widget

It has a few options:

  • Heading: It normally has the header “Ryuzine Press Editions” but you can customize it to say something else here (particularly if you need it in another language).
  • Display only on the home page? – If you want to restrict this list so it is only shown on your blog’s home page tick this checkbox.
  • Order Oldest to Newest (default) – determines if the list is ordered “ascending” or “descending”
  • Show Cover of Newest Issue? – If the newest issue has a shortcode set it will be used as a thumbnail in the list (this is the same thumbnail used by Ryuzine Rack)
  • Restrict Cover Thumbnail Size? – (NEW in 0.9.6.7) if “Show Cover” is checked and this is checked too it will use the settings in the next row:
  • Thumbnail Size (in pixels) either “High” or “Wide” – (NEW in 0.9.6.7) if size restriction is enabled the image will be scaled to whatever pixel size you set.  If you size by width the height is automatic, if you size by height the width is automatic, to maintain the image aspect ratio.  Note that this can be over-ridden by any CSS classes you might have set for images in your sidebar.
  • Hide widget if there is no content? If you don’t have any Editions published yet, or have deleted all your Editions for some reason checking this box will prevent it from showing an empty widget.

The following options only appear if you have “Ryuzine Rack” enabled on your blog:

  • Ryuzine Rack Heading: Normally this says “Ryuzine Rack” but you can customize it to say something else (for example “Library” or “Store”).  This becomes the link to your newsstand.
  • Show link to Ryuzine Rack? – Tick this box to determine if the link to the Ryuzine Rack webapp is shown or not (over-rides any Ryuzine Rack Heading you set).

Note: If you restrict the size of a cover thumbnail but type non-numeric characters in the box it will use the default size (125 pixels).  If you leave the box empty it ignores the restriction and uses the actual image size (unless CSS image classes for your sidebar over-ride it).  The cover thumbnail is also given the class “ryucover” if you want to create custom styling for it.

Social Widget

The Ryuzine webapp has a built-in option for your readers to share your publications on social networks or via email in the “Share Bubble.”  This custom “panel” in the Ryuzine user interface is accessible from the “Share This” button on the third set of app controls.

If you don’t configure anything it will use the default “E-mail Sharing Widget” which uses the platform’s e-mail client software (if any is available) to let users share the URL of the publication – including a specific page within the publication – with others via e-mail.

However, if you want your readers to be able to easily share your Ryuzine Press Editions with their friends on Facebook, Google+, Twitter, LinkedIn, etc., you’ll probably want to use a WordPress social network widget.  The “Share Bubble” is set up as a “sidebar” in the WordPress Appearance > Widgets section and you can just drag and drop a social network widget into the Ryuzine Share Bubble box (technically you can put any widget you like in the bubble, but it was intended for social networking).  In particular the share bubble works with Marijn Ronge’s Social Sharing Toolkit widget.

You can also paste social-networking code snippets into the box, for example those from Add This or Share This,  and they should work.  The “Share Bubble” will expand to contain whatever you drop into it, but you may not like the spacing or background color, etc., in which case you can also drop the “Text” widget into it and add <style>….</style> code to alter the appearance of the bubble or the widget content inside of it.

Tools: Rack Builder

The RyuzineRack newsstand is an optional webapp which replaces the standard Ryuzine archive page in WordPress. It will automatically include all your published Ryuzine Press Editions. However, you can also include additional content by appending the main catalog and/or creating additional catalogs.  There will always be one Catalog you cannot delete, but it doesn’t need to have anything in it either.

rackbuilder1

Adding and Deleting catalogs is as easy as anything else in WordPress.  Just press the “Add Catalog” or “Delete Catalog” buttons.  The default catalog will always be appended to the end of the automatically generated entries for your Ryuzine Press Editions.  However, any catalogs you manually add offer the option to “append” them or make them a “separate” catalog:rackcatalog_append

If you want to delete a catalog you’ve added press the “Delete” button at the top of the Tools section and a small box opens up with a list of all the extra catalogs by whatever names you gave them.  Select the checkbox(es) for the one(s) you want to get rid of and press the “Delete Checked” button – and heed the warning that it cannot be undone!

If you “append” the tables to the main catalog the items listed in them will just be added to that main catalog.  If you set them as a “separate” catalog, though, they will appear in the newsstand app’s “Sort List” panel.  If an end-user selects them the main catalog is unloaded and the selected catalog is loaded.  Users can only search or sort across a single catalog at a time.

Note: there is also a text link that reads “Hide Intro Text” which will hide the large block of explanatory text above the default Catalog table.  Once you start adding items and catalogs it can be annoying to have all that text taking up space so just go ahead and hide it.

What goes into a Catalog?

A catalog might contain links to store pages for print publications, or downloadable PDF files, and you can divide up the content into individual catalogs focused on a single year, title, media type, etc. Each catalog can also have an optional “masthead” image, which is displayed above the first page of newsstand items.

Additional items might include links to other websites, Ryuzine publications on other websites, links to store pages for print publications, downloads, etc.

Below you can see the Data Builder for the default catalog (which is always appended to the Ryuzine Press Edition archive data). The Catalog Names appear in the reader’s “Sort List” panel, as do the sortable column names (in bold black text in the table headers).

The drop-down lists for “Category” and “Type” are defined in the Options panel, as they are part of the Configuration File.

The [] arrow button in the table item rows will open the “Media Library” to select an image for the Cover Thumbnail or a Promotion Banner. You can also simply enter the word “auto” and RyuzineRack will automatically build a promotional layout for that item. However, to prevent too many items from being shown as promos it will always show the newest item as a promo, and then up to five additional items with promos, selected newest to oldest (or however many promos you set as minimum in Options > Ryuzine Rack.

Note that the Catalog files do not contain any actual image or document files.  Much like any database they can only hold text string data such as the URL to an image or a document type or category.

Cover and Promo images are scaled to fit the Ryuzine Rack layout, but they are scaled preserving the original aspect ratio.  Cover thumbnails are scaled to 150 pixels wide and Promo Banners are scaled to 600 pixels wide (75px and 300px for mobile portrait view).  If you are using the shortcode that cover image will be automatically used for the cover thumbnail of that Ryuzine Press Edition in Ryuzine Rack.  The Rack Catalog Builder is for adding content that is not a Ryuzine Press Edition.

Options: Ryuzine Rack

RyuzineRack is an optional newsstand webapp you can use to showcase your own Ryuzine Press Publications and other online content. If you are not using it you can safely ignore this settings tab. Otherwise this is where you can define the Media Types, Button Label text for each type, and the media categories.

Promo Animation – if there are at least 5 promotions in the carousel at the top of the newsstand they will auto-rotate on whatever interval you set in seconds.  If you want to disable the animation set it to zero.

Maximum Promotions – it obviously doesn’t make sense to make a promotion for everything.  Ideally you only want it to promote your most recent and/or best content.  Select the maximum number of promotions in the drop-down list.  Note that the newest item in your catalog will always automatically be promoted.

Link Opens –  option (added in version 0.9.6.3.4) sets how linked content from Ryuzine Rack opens when a user presses the buttons below a cover thumbnail or in an information card. The default behavior can vary, for example:

  1. Within the web browser the default is to open links in the same window. This replaces Ryuzine Rack with the linked content. If a user goes back to
    Ryuzine Rack it needs to reload the webapp.
  2. Within iOS “app view” (when bookmarked to the Home Screen and run from there) the default is to open links in a new window within Mobile Safari. iOS
    will switch from the “app view” Ryuzine Rack to the opened content in Mobile Safari.

The linkOpens option accepts a value corresponding to the following:

  • 0 = default – usually within the same window, except as noted above.
  • 1 = _self – forces link open in the same window, even in iOS “app view”
  • 2 = _blank – forces link open in a new window.
  • 3 = _parent – same as _self unless Ryuzine Rack was inside a frame in which case it opens in that frame’s parent frame.
  • 4 = _top – same as _self unless Ryuzine Rack was inside a frame in which case it opens in the window holding the frame.
  • 5 = an in-app experimental method that opens content within Ryuzine Rack

Older versions of Ryuzine Rack, and newer versions linked to an old configuration file, will simply ignore this setting and open content in the same window. On iOS devices if “native scrolling,” “iScroll,” and “Zoom & Pan” are all disabled a javascript method for linking is substituted.

The experimental “in-app” method (setting 5) builds an IFRAME within the Lightbox Gallery and then opens the linked content in that IFRAME. It also adds an overlay control at the center top allowing users to “Go Back to Rack” which closes the lightbox, unloads the IFRAME, and returns to the Ryuzine Rack list. If the document at which you are currently looking is not on your “Reading List” there is an “Add” button to do so. In tablet and desktop views it will also display thumbnail images of the covers of items that are on your “Reading List,” allowing you to click the cover images to load those items in the “in-app” window. Known problems include:

  • May break some secure sites that will not work inside an IFRAME
  • May require different touch gestures for interaction (depending on the device)
  • Using the browser’s bookmark/favorites control will likely only mark Ryuzine Rack – not the opened content (though the in-app Bookmarking and Sharing will point to the correct document)
  • The browser’s “Back” button will will load the site before Ryuzine Rack, not return the user to Ryuzine Rack from opened content.
  • On low-end devices there may also be a serious performance hit because it is still running Ryuzine Rack underneath the other content
  • May crash some mobile browsers by exceeding the cache limit
  • It attempts to shift user focus to the opened content, but it is still possible in-app keyboard shortcuts will be controlling Ryuzine Rack (underneath) instead of the loaded Content (on top) until the user interacts with the opened content by mouse or touch

This method does, however, keep users at your web domain regardless of where the content you are linking to is hosted, and it also means returning to Ryuzine Rack doesn’t require reloading the entire webapp (as it was never closed). But the aforementioned possible issues are why we’re calling this method “experimental” right now. As with all the linkOpens options, earlier versions of Ryuzine Rack will simply ignore this setting.

Items Per Page – this sets the default number of items to show per page.  The more items you show the longer it will take the app to load, but too few items may cause your catalog to have too many pages.  End users have the ability to customize this to their own liking in the Options panel, you’re just declaring the starting number of items to display.

Media Types – the “Media Type/Button Label” pairs determine what types of media appear on the drop-down list in the “Rack Catalog Builder” and the button label determines what text appears on the button under the cover thumbnail for that type of media when it is shown in the newsstand’s sort results.  The media type also appears as a link in the item details which users can select to search the catalog for only items of that type.

Media Categoriesthe six text entry fields determine what categories are available in the drop-down list of the “Rack Catalog Builder” and also appear in the item details as a link that allows users to search the catalog only for other items in that same category.
UPDATE 0.9.6.6+: You now can define as many Rack Categories as you want (it’s under Ryuzine Press > Rack Categories).  These will automatically appear as a drop-down list on the Rack Options page where you can set one of them as the default media category.  These same drop-down options appear on the Rack Catalog Builder for each row, and as a meta-box with radio button selectors on the Edit page for Ryuzine Press Editions (but only if you’ve actually installed Ryuzine Rack to your current theme).

Options: Shortcodes

Built-In Lightbox

Even if you are using a lightbox plugin or script elsewhere on your blog it probably won’t work in your Ryuzine Press editions because they do not use the standard WordPress headers and footers (where the lightbox plugins typically enqueue their scripts). So Ryuzine Press has its own built-in lightbox system, which is accessible through two WordPress shortcodes.

When you go to Ryuzine > Add New you can create your “lightbox gallery” in the post compose textbox. Define each item with the shortcode:

ryubox id=”your_id” orient=”land|port. . .whatever content you want in the lightbox. . ./ryubox

You can use anything you want for the “id” value, you’ll just need to know what it is when you create the link to open it. The “orient” attribute is optional for landscape orientation content (“land” is automatically assumed), however if the content in the lightbox is portrait orientation set the value to “port” so it will fit by height, rather than width, in the webapp.

The lightbox is primarily intended for displaying images, but it can also be used to showcase other content. However, if you use non-image content either code it with max-width and max-height or percentages so it can scale, or add scaling by media-query in the issue stylesheet. If you don’t the content may not fit in the browser window on smaller screen devices.

Note: The ryubox shortcode ONLY works inside Ryuzine Press posts

Lightbox Links

In order to trigger the built-in lightbox you’ll need to add special links to your posts with this shortcode:

ryuboxlink id=”your_id” type=”video”. . .link text or (preferably) thumbnail image. . ./ryuboxlink

Match the “id” value to the same “id” value of a ryubox item.

The “type=” parameter is completely optional, but allows you to control what kind of icon appears in the lower corner of the link.  The valid types are:

  • larger
  • magnify
  • photo
  • video
  • movie
  • info
  • 3d
  • website
  • document

Normally any ryuboxlink content will not be visible in the post when viewed in your regular blog theme. However, if you want it to appear in the blog as well (for example to trigger a regular WordPress plugin’s lightbox effect) change the “Lightbox Links” setting to “Show” the links elsewhere on your blog.

Cover Images

In your Ryuzine Press editions you can now surround an image placed from your Media Library with the “ryucover” shortcode. This image is used by the optional Ryuzine Rack newsstand webapp (which replaces the auto-generated Archive page) and is also used if you have set “Use ryucover shortcode image” as the Cover Source under the “Covers” tab above.  Syntax:

ryucover bleed=”0|1|cover|2|contain|3|width|4|height” color=”white|blue|#ccc” shift=”Xpx Ypx”…../ryucover

The ryucover shortcode now accepts up to three optional parameters, “bleed,” “color,” and/or “shift.” The “bleed” option accepts the following settings:

  • 0 | null : Set it to zero or no value (or omit the parameter entirely) and any image wrapped by the shortcode will be embedded in the page content, rather than set as the cover’s background.
  • 1 | cover : Fits the image, maintaining the aspect ratio, to the LARGEST size it can be that fits BOTH the width and height.
  • 2 | contain : Fits the image, maintaining the aspect ratio, to the SMALLEST size that will fit BOTH the width and height.
  • 3 | width : Will take any image wrapped in the shortcode and set it as the cover’s background, center it, and scale (maintaining the aspect ratio) by width. Any part of the image that does not fit spills beyond the borders of the page.
  • 4 | height : Will scale the background image (maintaining aspect ratio) to fit by height with any parts of the image that do not fit spilling beyond the borders of the page.

Generally the “cover” and “width” settings are similar and “contain” and “height” are similar, but they may render with slightly different bordering if they are not an exact fit for the space.

The “color” parameter, if omitted or left empty, defaults to “white.” Otherwise you can set it to any valid HTML color by name (such as “blue”), hex code (“#cccccc”), hex code shorthand (“#ccc”), or rgb/rgba color set. If you set an invalid value your background image also will not show

The “shift” parameter allows you to adjust the positioning of the background image. The default position is “center 0” if you omit this parameter, which is what you most likely want. However, if you want to change the positioning the syntax is “Xpx Ypx” with a space between the values, which need to be set in pixels. Other valid values include “center center” (may move top of image out of view), “0 0” (does not need “px”), “left top” (same as “0 0”), “right bottom” (or similar word combinations).

Promotions (Ryuzine Rack)

If you include a promotional image it is used by the optional Ryuzine Rack in the animated carousel at the top of the webapp. Ryuzine Rack will always grab the newest item and promote it (if there is no promo image it automatically builds a promotion using the catalog info). Additional promotions (if any) are displayed by date, newest to oldest, up to the maximum number of promotions you set on the Ryuzine Rack Options tab. The ryupromo shortcode has no additional parameters:

ryupromo…../ryupromo

Cover & Promo Hints

Here are things to keep in mind when including a “ryucover” and “ryupromo” shortcodes:

Only the first instance of the shortcode will be used. Any additional ones for the same Edition are ignored by both Ryuzine Press and Ryuzine Rack. However they may still be displayed if you are using the auto-generated Archive page and a theme which displays full content in archive search results.

The shortcode-wrapped images are automatically scaled to fit their respective spaces. If they are too small or low resolution they’ll look terrible when scaled up.

Ideally place at least a “Medium” sized image that links to the full-size image. Ryuzine Rack will prefer the thumbnail, Ryuzine Press will prefer the full-size image. If you place an image without a link both will end up using the same image.

Cover images should be in “portrait” orientation, not “landscape.” The cover images are distorted to fit the aspect ratio of the cover thumbnail. Images used as Edition covers, though, are scaled to fit by width while maintaining the original aspect ratio of the image.

Promotional banners should be in “landscape” mode, not “portrait.” The promotional images are scaled to fit the carousel by width while maintaining the aspect ratio (i.e., they are not distorted).

The maximum display sizes are 150×230 pixels for Ryuzine Rack cover thumbnails and about 640×800 for Ryuzine Press Edition covers.

All promotional images should be 640×300 pixels. If you do not want to create one simply do this: ryupromoauto/ryupromo and Ryuzine Rack will automatically construct a promotion for that item.

For better image quality on high-density displays (like on the iPad 3 and iPhone 4 or 5) you need to use images around 2x larger than the dimensions given immediately above.

To make Ryuzine Rack load more quickly you can sacrifice image quality and use smaller images that will load faster. You can also reduce the maximum number of promotions and promotional images.

Embed Ryuzine

NEW in version 0.9.6.6!

ryuzine title=”Ryuzine Press Edition Title”

This shortcode allows you to easily embed any Ryuzine Press Edition in a blog post or page (similar to how you can embed videos) by just using the Edition’s title. The shortcode accepts the following parameters:

  • title: The actual title of a Ryuzine Press Edition or “ryuzine-rack” to embed the newsstand (assuming it is installed to the current theme).
  • url: Allows entering a raw URL (over-rides any “title” setting) but is restricted to YOUR site and only Ryuzine Press Editions*
  • page: On load flip the Edition to a specific page number.
  • height: The height of the embedded publication in pixels or percent (add “%” sign if percentage)
  • width: The width of the embedded publication in pixels or percent (add “%” sign if percentage)
  • size: small|medium|large|spread enter one of these preset sizes (if present over-rides height and width)
  • class: a stylesheet class name to apply to the iframe
  • style: inline styles to apply to the iframe

Everything other than the “title” is optional. You can also style the different elements of the embed by the following classnames:

  • ryuzine_embed – the DIV container for the embed
  • ryu_embed_tab – the links below the embedded Ryuzine
  • ryu_embed_tabbox” – the main container for the “Embed Code” form (div container not form tag)
  • ryu_embed_input – the Height and Width text inputs

* Embedding off-site Ryuzine URLs is blocked by design. Because you do not control a third-party site embedding represents a security risk. If you want to cross-promote with other Ryuzine publishers use the Ryuzine Rack Catalog Builder to create an entries for their content and install Ryuzine Rack to your theme.

Options: Advertising

The fourth tab on the “Options” section is for configuration of any Advertising using the webapp’s built-in ad areas.

Please Note: Revenue generating publications require a Commercial Use License available at www.ryumaru.com. Please read the license file or email sales@ryumaru.com if you are not sure if you need a Commercial Use license. Only advertising placed in the Ryuzine webapp itself is taken into consideration for licensing terms, advertising incorporated into your regular blog theme is not subject to the Ryuzine licensing requirements.

Add Display Settings

This is where you really enable each of the built-in ad areas by setting how long the ad(s) will display.  For “Splash Ad” and “Box Ad” setting to zero will disable them, any other values will be the number of seconds to display the ad before automatically moving on.

For the “Banner Ad” option, though, you need to enter the word “null” to disable it as zero makes the banner “persistent” (though it’s not truly persistent since end users can manually close the ad and it won’t come back, but it will remain visible unless and until the end user does that).    Any other value will be the interval for the banner in seconds.  For example if you entered “90” in the box the banner ad would first appear after 1.5 minutes and remain visible for 1.5 minutes (unless a user manually closes it sooner) before disappearing for 1.5 minutes.

Ad Content Settings

Each of the built-in advertising areas has a similar method of configuration.

Type – You can select whether to use an image from your WordPress Media Library or some other type of advertising content.  If you select “Other Type” the image URL box is replaced by a text area box into which you can enter any kind of code.  In particular this means you can add “ad rotator” scripts, code to embed a Flash ad, or a code snippet for some third-party ad service.

The “Disable this Ad” checkbox will keep the ad content (whatever it is) from displaying in your Ryuzine Press Editions.  This option means you can set up various ads and have them ready to go and simply uncheck to box to make them go “live” in your magazines, for example, as part of a promotion or marketing campaign.

Ad Content – as noted above this will either be an image from your Media Library with or without a corresponding link entered in the “Ad Link URL” box or some other type of advertising code.

Keep in mind the available space for these ads within the webapp.  While images are automatically scaled to fit by width, other ad types may not auto-adjust.