{"id":25,"date":"2018-01-19T18:50:55","date_gmt":"2018-01-19T18:50:55","guid":{"rendered":"https:\/\/archivebinge.com\/blog\/?p=25"},"modified":"2021-06-17T00:40:29","modified_gmt":"2021-06-17T00:40:29","slug":"archive-binge-compatibility","status":"publish","type":"post","link":"https:\/\/archivebinge.com\/blog\/archive-binge-compatibility\/","title":{"rendered":"Archive Binge Compatibility"},"content":{"rendered":"\n<p>Due to some awesome word of mouth, Archive Binge has grown a lot despite being in Alpha. Through the growth, there have been a number of comics added that, for some reason or another, AB isn&#8217;t quite compatible with (yet!), either through the crawler or the reader. If you&#8217;re looking to add your comics, here&#8217;s some quick tips on making your site as compatible as possible:<\/p>\n\n\n\n<h2>The Crawler\/Submission<\/h2>\n\n\n\n<p>The crawler currently works by identifying a unique tag on the &#8220;next page&#8221; link in your comic navigation, and then repeatedly following that link through the entire comic to find all of the pages. If there&#8217;s no unique marker on the link, it has a lot of trouble finding the next page amoung all the other links on the site.<\/p>\n\n\n\n<p>To make it work as smoothly as possible, try adding a rel=&#8221;next&#8221; to the &#8220;next page&#8221; link in your comic&#8217;s navigation. It looks like this:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;a href=\"\/nextpage\" rel=\"next\">&lt;img src=\"imgs\/next.png\" alt=\"Next\" \/>&lt;\/a><\/code><\/pre>\n\n\n\n<p>If that still doesn&#8217;t work*, you can also try adding a bit of code in your comic&#8217;s header, showing what the link to the next page is:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;link rel=\"next\" href=\"http:\/\/www.yourcomic.com\/link\/to\/next\/\" \/><\/code><\/pre>\n\n\n\n<p><small>* There are instances where it doesn&#8217;t work even if you have a unique marker on the link. Usually it&#8217;s the presence of a dropdown listing links to pages that does this. If this happens, try adding a &lt;link rel&#8230;&gt; higher up on the page or <a href=\"mailto: support@archivebinge.com\">contact me<\/a>.<\/small><\/p>\n\n\n\n<h3>Comic Fury<\/h3>\n\n\n\n<p>Add this to the &lt;head&gt; section of Overall in the HTML editor:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;link rel=\"next\" href=\"&#91;v:nextcomic]\" \/><\/code><\/pre>\n\n\n\n<p>Doing this will not only make your comic more compatible with the crawler; it may also <a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/HTTP\/Link_prefetching_FAQ\">speed up your comic&#8217;s loading time in some browsers<\/a>.<\/p>\n\n\n\n<p>If you have any trouble adding your comic to the website, whether or not you try this method, <a href=\"mailto:support@archivebinge.com\">please let me know<\/a> and I can see about getting your comic added. I&#8217;m currently working on revising the crawler so it will work more reliably on more websites, even if there&#8217;s no unique identifier to look for.<\/p>\n\n\n\n<h2><a id=\"reader\"><\/a>The Reader<\/h2>\n\n\n\n<p>The most common issue on the reader is this:<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" width=\"300\" height=\"192\" src=\"https:\/\/i2.wp.com\/archivebinge.com\/blog\/wp-content\/uploads\/2018\/01\/Selection_025.png?resize=300%2C192&#038;ssl=1\" alt=\"\" class=\"wp-image-28\" srcset=\"https:\/\/i2.wp.com\/archivebinge.com\/blog\/wp-content\/uploads\/2018\/01\/Selection_025.png?resize=300%2C192&amp;ssl=1 300w, https:\/\/i2.wp.com\/archivebinge.com\/blog\/wp-content\/uploads\/2018\/01\/Selection_025.png?w=576&amp;ssl=1 576w\" sizes=\"(max-width: 300px) 100vw, 300px\" data-recalc-dims=\"1\" \/><\/figure>\n\n\n\n<p>A blank white screen.<\/p>\n\n\n\n<p>This is usually caused by the webcomic&#8217;s server preventing the comic from being embedded in an iframe. This is a <a href=\"https:\/\/www.owasp.org\/index.php\/Clickjacking_Defense_Cheat_Sheet\">completely valid security practice<\/a>&nbsp;and I won&#8217;t recommend disabling it entirely, but it does cause some trouble for Readers like Archive Binge&#8217;s. Fortunately, there&#8217;s a way to allow Archive Binge without disabling the setting entirely. The method depends on the server type you&#8217;re hosting with:<\/p>\n\n\n\n<h3>Apache (with mod_headers enabled)<\/h3>\n\n\n\n<p>Add this line to your .htaccess file:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>Header set Content-Security-Policy \"frame-ancestors http:\/\/archivebinge.com\"<\/code><\/pre>\n\n\n\n<p>If you&#8217;re not sure how to edit your .htaccess file, please check with your web host. It will likely be a hidden file in your website&#8217;s directory.<\/p>\n\n\n\n<h3>nginx<\/h3>\n\n\n\n<p>Add this line to your site&#8217;s configuration:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>add_header Content-Security-Policy \"frame-ancestors http:\/\/archivebinge.com\"<\/code><\/pre>\n\n\n\n<h3>IIS<\/h3>\n\n\n\n<p>In your site configuration, in the &lt;customHeaders&gt; section, add:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;add name=\"Content-Security-Policy\" value=\"frame-ancestors http:\/\/archivebinge.com\" \/><\/code><\/pre>\n\n\n\n<h3>x-frame-options<\/h3>\n\n\n\n<p>If you have access to edit your x-frame-options directly, try setting it to this:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>Header set X-Frame-Options \"ALLOW-FROM http:\/\/archivebinge.com\"<\/code><\/pre>\n\n\n\n<p>If none of these options work or result in errors, please check with your webhost&#8217;s support department and they may be able to assist you. Alternatively, I can switch your comic to use the Webtoons-style bookmarking system in which your comic isn&#8217;t loaded in an iframe, but the reader can manually mark their place as they read (For example:&nbsp;https:\/\/archivebinge.com\/comic\/140). If you would like me to switch your comic to the Webtoons system, <a href=\"mailto:support@archivebinge.com\">please let me know<\/a>!<\/p>\n\n\n\n<p>Hope this helps and, as always, please let me know if you run into any trouble or have any suggestions or feedback for the site. Read on!<\/p>\n\n\n\n<p><em>Reference:&nbsp;<a href=\"https:\/\/ole.michelsen.dk\/blog\/secure-your-website-with-content-security-policy.html\">https:\/\/ole.michelsen.dk\/blog\/secure-your-website-with-content-security-policy.html<\/a><\/em><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Due to some awesome word of mouth, Archive Binge has grown a lot despite being in Alpha. Through the growth, there have been a number of comics added that, for some reason or another, AB isn&#8217;t quite compatible with (yet!), either through the crawler or the reader. If you&#8217;re looking to add your comics, here&#8217;s &hellip; <a href=\"https:\/\/archivebinge.com\/blog\/archive-binge-compatibility\/\" class=\"more-link\">Continue reading <span class=\"screen-reader-text\">Archive Binge Compatibility<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"spay_email":""},"categories":[1],"tags":[],"jetpack_featured_media_url":"","_links":{"self":[{"href":"https:\/\/archivebinge.com\/blog\/wp-json\/wp\/v2\/posts\/25"}],"collection":[{"href":"https:\/\/archivebinge.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/archivebinge.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/archivebinge.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/archivebinge.com\/blog\/wp-json\/wp\/v2\/comments?post=25"}],"version-history":[{"count":20,"href":"https:\/\/archivebinge.com\/blog\/wp-json\/wp\/v2\/posts\/25\/revisions"}],"predecessor-version":[{"id":66,"href":"https:\/\/archivebinge.com\/blog\/wp-json\/wp\/v2\/posts\/25\/revisions\/66"}],"wp:attachment":[{"href":"https:\/\/archivebinge.com\/blog\/wp-json\/wp\/v2\/media?parent=25"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/archivebinge.com\/blog\/wp-json\/wp\/v2\/categories?post=25"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/archivebinge.com\/blog\/wp-json\/wp\/v2\/tags?post=25"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}