{"id":125556,"date":"2020-08-22T15:42:30","date_gmt":"2020-08-22T15:42:30","guid":{"rendered":"https:\/\/wordpress.org\/plugins\/ashtabula\/"},"modified":"2022-12-18T07:44:28","modified_gmt":"2022-12-18T07:44:28","slug":"ashtabula","status":"publish","type":"plugin","link":"https:\/\/pcd.wordpress.org\/plugins\/ashtabula\/","author":14816408,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_crdt_document":"","version":"1.0.0","stable_tag":"1.0.0","tested":"6.1.10","requires":"5.3.2","requires_php":"7.2","requires_plugins":"","header_name":"Ashtabula","header_author":"caught my eye","header_description":"Allows Swiper.js to work in WordPress.","assets_banners_color":"707470","last_updated":"2022-12-18 07:44:28","external_support_url":"","external_repository_url":"","donate_link":"https:\/\/ko-fi.com\/marklchaves","header_plugin_uri":"https:\/\/github.com\/marklchaves\/ashtabula","header_author_uri":"https:\/\/www.caughtmyeye.cc","rating":0,"author_block_rating":0,"active_installs":0,"downloads":2048,"num_ratings":0,"support_threads":0,"support_threads_resolved":0,"author_block_count":0,"sections":["description","installation","faq","changelog"],"tags":{"1.0.0":{"tag":"1.0.0","author":"mlchaves","date":"2022-12-18 07:44:28"}},"upgrade_notice":{"1.0.0":"<ul>\n<li>Now using a local copy of the Swiper 6.1.1 JS and CSS libraries.<\/li>\n<li>Changed plugin directory structure to follow <a href=\"https:\/\/developer.wordpress.org\/plugins\/plugin-basics\/best-practices\/\">WordPress best practices<\/a>.<\/li>\n<\/ul>"},"ratings":[],"assets_icons":{"icon-128x128.png":{"filename":"icon-128x128.png","revision":2367113,"resolution":"128x128","location":"assets","locale":""},"icon-256x256.png":{"filename":"icon-256x256.png","revision":2367113,"resolution":"256x256","location":"assets","locale":""}},"assets_banners":{"banner-1544x500.jpg":{"filename":"banner-1544x500.jpg","revision":2367113,"resolution":"1544x500","location":"assets","locale":""},"banner-772x250.jpg":{"filename":"banner-772x250.jpg","revision":2367113,"resolution":"772x250","location":"assets","locale":""}},"assets_blueprints":{},"all_blocks":[],"tagged_versions":["1.0.0"],"block_files":[],"assets_screenshots":{"screenshot-1.png":{"filename":"screenshot-1.png","revision":2367113,"resolution":"1","location":"assets","locale":""},"screenshot-2.png":{"filename":"screenshot-2.png","revision":2367113,"resolution":"2","location":"assets","locale":""}},"screenshots":{"1":"Example slider card on large devices.","2":"Example slider card on small devices."},"jetpack_post_was_ever_published":false},"plugin_section":[],"plugin_tags":[606,611,71207],"plugin_category":[],"plugin_contributors":[182726],"plugin_business_model":[],"class_list":["post-125556","plugin","type-plugin","status-publish","hentry","plugin_tags-responsive","plugin_tags-slider","plugin_tags-swiper","plugin_contributors-mlchaves","plugin_committers-mlchaves"],"banners":{"banner":"https:\/\/ps.w.org\/ashtabula\/assets\/banner-772x250.jpg?rev=2367113","banner_2x":"https:\/\/ps.w.org\/ashtabula\/assets\/banner-1544x500.jpg?rev=2367113","banner_rtl":false,"banner_2x_rtl":false},"icons":{"svg":false,"icon":"https:\/\/ps.w.org\/ashtabula\/assets\/icon-128x128.png?rev=2367113","icon_2x":"https:\/\/ps.w.org\/ashtabula\/assets\/icon-256x256.png?rev=2367113","generated":false},"screenshots":[{"src":"https:\/\/ps.w.org\/ashtabula\/assets\/screenshot-1.png?rev=2367113","caption":"Example slider card on large devices."},{"src":"https:\/\/ps.w.org\/ashtabula\/assets\/screenshot-2.png?rev=2367113","caption":"Example slider card on small devices."}],"raw_content":"<!--section=description-->\n<p>This plugin allows you to use of the popular <a href=\"https:\/\/swiperjs.com\/\">Swiper.js<\/a> library in WordPress.<\/p>\n\n<p>This is a minimalist plugin that is for displaying responsive cards in a slide.<\/p>\n\n<ul>\n<li>On a large screen device, the slide will show a horizontal card (image on the left and text on the right). <\/li>\n<li>On a small device, the slide becomes a stacked card with the image on the top and text on the bottom.<\/li>\n<\/ul>\n\n<p>See the screengrabs below to get a visual or visit the <a href=\"https:\/\/streetphotography.blog\/ashtabula-swiper-slider\/\">live demo<\/a>.<\/p>\n\n<p><strong>Note<\/strong>: You should be comfortable with HTML and CSS to use this plugin.<\/p>\n\n<h3>Usage<\/h3>\n\n<ol>\n<li>Use the <a href=\"https:\/\/github.com\/marklchaves\/ashtabula\/blob\/master\/ashtabula-demo.html\">demo HTML file<\/a> as a starter template. Add this HTML to a HTML or code block\/element to your page or post.<\/li>\n<li>To add the images, use the example CSS below as a template. Add the CSS to your <strong>Appearance<\/strong> &gt; <strong>Customize<\/strong> &gt; <strong>Additional CSS<\/strong> or your child theme's <code>style.css<\/code> file.<\/li>\n<\/ol>\n\n<p>CSS example to specify the background image for the responsive card in a slide.<\/p>\n\n<pre><code>\/**\n * Swiper Slider Plugin Custom Styles\n *\/\n\n#my-swiper-slide-1 {\n background-image: url(mybgimg-1.png);\n}\n#my-swiper-slide-2 {\n background-image: url(mybgimg-2.png);\n}\n#my-swiper-slide-3 {\n background-image: url(mybgimg-3.png);\n}\n<\/code><\/pre>\n\n<h3>Credits<\/h3>\n\n<p>Powered by <a href=\"https:\/\/swiperjs.com\/\">Swiper.js<\/a>.<\/p>\n\n<!--section=installation-->\n<ol>\n<li>Upload the contents of plugin zip file to the <code>\/wp-content\/plugins\/ashtabula<\/code> directory, or install the plugin through the WordPress plugins page directly.<\/li>\n<li>Activate the plugin through the 'Plugins' page.<\/li>\n<\/ol>\n\n<!--section=faq-->\n<dl>\n<dt id='how%20can%20i%20change%20the%20swiper.js%20settings%3F'><h3>How can I change the Swiper.js settings?<\/h3><\/dt>\n<dd><p>You can override the <code>ashtabula.js<\/code> file. Here's an example.<\/p>\n\n<p>Add this to your child theme's functions.php file.<\/p>\n\n<pre><code>\/** Override Swiper Slider Plugin JS *\/\nfunction override_ssp_js()\n{\n    wp_dequeue_script('ashtabula');\n    wp_enqueue_script('swiper-slider-custom-js', get_stylesheet_directory_uri().'\/js\/swiper-slider-custom.js', '', '1.0.0', true);\n}\nadd_action('wp_enqueue_scripts', 'override_ssp_js', 100);\n<\/code><\/pre>\n\n<p>Create this file: <code>\/js\/swiper-slider-custom.js<\/code>. Add this code to the file. It will override the default plugin settings for Swiper.js.<\/p>\n\n<pre><code>\/**\n * Make the slides:\n * 1. Slide up instead of \n * to the right.\n * 2. Loop instead of rewind.\n * 3. Speed up to 3 seconds.\n *\/\n(function () {\n  let swiper = new Swiper(\".swiper-container\", {\n    autoplay: {\n      delay: 3000,\n    },\n    direction: \"vertical\",\n    loop: true,\n  });\n})();\n<\/code><\/pre><\/dd>\n\n<\/dl>\n\n<!--section=changelog-->\n<h4>1.0.0<\/h4>\n\n<ul>\n<li>First release. Tested on the Twenty Twenty and GeneratePress themes.<\/li>\n<\/ul>","raw_excerpt":"Ashtabula - A Swiper Slider Plugin for WordPress","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/pcd.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin\/125556","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/pcd.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin"}],"about":[{"href":"https:\/\/pcd.wordpress.org\/plugins\/wp-json\/wp\/v2\/types\/plugin"}],"replies":[{"embeddable":true,"href":"https:\/\/pcd.wordpress.org\/plugins\/wp-json\/wp\/v2\/comments?post=125556"}],"author":[{"embeddable":true,"href":"https:\/\/pcd.wordpress.org\/plugins\/wp-json\/wporg\/v1\/users\/mlchaves"}],"wp:attachment":[{"href":"https:\/\/pcd.wordpress.org\/plugins\/wp-json\/wp\/v2\/media?parent=125556"}],"wp:term":[{"taxonomy":"plugin_section","embeddable":true,"href":"https:\/\/pcd.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_section?post=125556"},{"taxonomy":"plugin_tags","embeddable":true,"href":"https:\/\/pcd.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_tags?post=125556"},{"taxonomy":"plugin_category","embeddable":true,"href":"https:\/\/pcd.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_category?post=125556"},{"taxonomy":"plugin_contributors","embeddable":true,"href":"https:\/\/pcd.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_contributors?post=125556"},{"taxonomy":"plugin_business_model","embeddable":true,"href":"https:\/\/pcd.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_business_model?post=125556"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}