{"id":1684,"date":"2017-04-12T13:37:00","date_gmt":"2017-04-12T13:37:00","guid":{"rendered":"http:\/\/www.gopiplus.com\/extensions\/?p=1684"},"modified":"2021-03-28T14:36:41","modified_gmt":"2021-03-28T14:36:41","slug":"drupal-module-horizontal-image-scrolling","status":"publish","type":"post","link":"http:\/\/www.gopiplus.com\/extensions\/2017\/04\/drupal-module-horizontal-image-scrolling\/","title":{"rendered":"Drupal module horizontal image scrolling"},"content":{"rendered":"\n<p>Horizontal image scrolling module display and scroll the images in horizontal style, scroll will start automatically. Slideshow will pause on mouse over. In the admin we have option to enter WIDTH and HEIGHT of the galley. Also we have option to enter image URL.<\/p>\n\n\n<div class=\"ads-row\">\n\t<div class=\"ads-column1\">\n\t\t<script async src=\"\/\/pagead2.googlesyndication.com\/pagead\/js\/adsbygoogle.js\"><\/script>\n\t\t<!-- Drupal Module Middle -->\n\t\t<ins class=\"adsbygoogle\"\n\t\t\t style=\"display:inline-block;width:336px;height:280px\"\n\t\t\t data-ad-client=\"ca-pub-6676019656533652\"\n\t\t\t data-ad-slot=\"3286266642\"><\/ins>\n\t\t<script>\n\t\t(adsbygoogle = window.adsbygoogle || []).push({});\n\t\t<\/script>\n\t<\/div>\n\t<div class=\"ads-column2\">\n\t\t<script async src=\"\/\/pagead2.googlesyndication.com\/pagead\/js\/adsbygoogle.js\"><\/script>\n\t\t<!-- Drupal Module Middle 2 -->\n\t\t<ins class=\"adsbygoogle\"\n\t\t\t style=\"display:inline-block;width:336px;height:280px\"\n\t\t\t data-ad-client=\"ca-pub-6676019656533652\"\n\t\t\t data-ad-slot=\"8528923427\"><\/ins>\n\t\t<script>\n\t\t(adsbygoogle = window.adsbygoogle || []).push({});\n\t\t<\/script>\n\t<\/div>\n<\/div>\n\n\n\n<h2 class=\"wp-block-heading\">Features of this module<\/h2>\n\n\n\n<p>1. Easy to customize.<br>2. Support all browser.<br>3. Automatically pauses on mouse over.<br>4. Hyperlink option to each images.<br>5. Option to set spacing between images.<br>6. Easy to change the background color of scroll.<\/p>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\"><p>Module <strong>Live Demo<\/strong> available in this page. You may also be interested in <a href=\"http:\/\/www.gopiplus.com\/extensions\/2017\/04\/drupal-module-vertical-image-scrolling\/\">vertical image scrolling<\/a> Drupal module.<\/p><\/blockquote>\n\n\n<div class=\"livedemo\">\n<h2 style=\"padding-bottom:10px;\">Live Demo<\/h2>\n<script type=\"text\/javascript\">\nvar IHRSS_WIDTH = \"100%\";\nvar IHRSS_HEIGHT = \"75px\";\nvar IHRSS_SPEED = 1;\nvar IHRSS_BGCOLOR = \"#FFFFFF\";\nvar IHRSS_SLIDESRARRAY=new Array();\nvar IHRSS_SLIDESRARRAY1=new Array();\nvar IHRSS_FINALSLIDE ='';\nIHRSS_SLIDESRARRAY[0]='<img decoding=\"async\" style=\"display:inline;max-width: none;box-shadow: 0px 0px 0px 0px;padding-right:10px;\" src=\"http:\/\/www.gopiplus.com\/work\/wp-content\/uploads\/pluginimages\/100x75\/sing_1.jpg\" \/>';\t\nIHRSS_SLIDESRARRAY[1]='<img decoding=\"async\" style=\"display:inline;max-width: none;box-shadow: 0px 0px 0px 0px;padding-right:10px;\" src=\"http:\/\/www.gopiplus.com\/work\/wp-content\/uploads\/pluginimages\/100x75\/sing_2.jpg\" \/>';\t\nIHRSS_SLIDESRARRAY[2]='<img decoding=\"async\" style=\"display:inline;max-width: none;box-shadow: 0px 0px 0px 0px;padding-right:10px;\" src=\"http:\/\/www.gopiplus.com\/work\/wp-content\/uploads\/pluginimages\/100x75\/sing_3.jpg\" \/>';\t\nIHRSS_SLIDESRARRAY[3]='<img decoding=\"async\" style=\"display:inline;max-width: none;box-shadow: 0px 0px 0px 0px;padding-right:10px;\" src=\"http:\/\/www.gopiplus.com\/work\/wp-content\/uploads\/pluginimages\/100x75\/sing_4.jpg\" \/>';\t\nIHRSS_SLIDESRARRAY[4]='<img decoding=\"async\" style=\"display:inline;max-width: none;box-shadow: 0px 0px 0px 0px;padding-right:10px;\" src=\"http:\/\/www.gopiplus.com\/work\/wp-content\/uploads\/pluginimages\/100x75\/sing_5.jpg\" \/>';\t\nIHRSS_SLIDESRARRAY[5]='<img decoding=\"async\" style=\"display:inline;max-width: none;box-shadow: 0px 0px 0px 0px;padding-right:10px;\" src=\"http:\/\/www.gopiplus.com\/work\/wp-content\/uploads\/pluginimages\/100x75\/sing_6.jpg\" \/>';\t\nIHRSS_SLIDESRARRAY1[0]='<img decoding=\"async\" style=\"display: none;max-width: none;\" src=\"http:\/\/www.gopiplus.com\/work\/wp-content\/uploads\/pluginimages\/100x75\/sing_1.jpg\" \/>';\t\nIHRSS_SLIDESRARRAY1[1]='<img decoding=\"async\" style=\"display: none;max-width: none;\" src=\"http:\/\/www.gopiplus.com\/work\/wp-content\/uploads\/pluginimages\/100x75\/sing_2.jpg\" \/>';\t\nIHRSS_SLIDESRARRAY1[2]='<img decoding=\"async\" style=\"display: none;max-width: none;\" src=\"http:\/\/www.gopiplus.com\/work\/wp-content\/uploads\/pluginimages\/100x75\/sing_3.jpg\" \/>';\t\nIHRSS_SLIDESRARRAY1[3]='<img decoding=\"async\" style=\"display: none;max-width: none;\" src=\"http:\/\/www.gopiplus.com\/work\/wp-content\/uploads\/pluginimages\/100x75\/sing_4.jpg\" \/>';\t\nIHRSS_SLIDESRARRAY1[4]='<img decoding=\"async\" style=\"display: none;max-width: none;\" src=\"http:\/\/www.gopiplus.com\/work\/wp-content\/uploads\/pluginimages\/100x75\/sing_5.jpg\" \/>';\t\nIHRSS_SLIDESRARRAY1[5]='<img decoding=\"async\" style=\"display: none;max-width: none;\" src=\"http:\/\/www.gopiplus.com\/work\/wp-content\/uploads\/pluginimages\/100x75\/sing_6.jpg\" \/>';\t\nvar IHRSS_IMGGAP = \"\";\nvar IHRSS_PIXELGAP = 0;\n<\/script>\n<script src=\"http:\/\/www.gopiplus.com\/extensions\/my-plugin\/demo\/image-horizontal-reel-scroll-slideshow.js\" type=\"text\/javascript\"><\/script>\n<\/div>\n\n\n\n<h2 class=\"wp-block-heading\">Module installation steps<\/h2>\n\n\n\n<p><strong>Step 1 Download the module:<\/strong><br>Download the module (horizontal_image_scrolling.zip) from the below mentioned <a href=\"http:\/\/www.gopiplus.com\/extensions\/2017\/04\/drupal-module-horizontal-image-scrolling-download-link\/\">download<\/a> link and check the module version, it must compatible to your drupal.<\/p>\n\n\n\n<p><strong>Step 2 Extract the files:<\/strong><br>Extract the available compressed file into your local drive and find the folder horizontal_image_scrolling<\/p>\n\n\n\n<p><strong>Step 3 Upload the folder:<\/strong><br>Using FTP, Upload the folder (horizontal_image_scrolling) into your drupal website. You should upload the file into yoursite.com\/modules\/ this directory.<\/p>\n\n\n\n<p>If you don&#8217;t know how to upload the file using FTP, follow the below 2nd option to install your <strong>Horizontal image scrolling<\/strong> module.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"http:\/\/www.gopiplus.com\/extensions\/my-plugin\/screens\/drupal\/common\/drupal_install_new_module.png\" alt=\"horizontal image scrolling drupal module installation\"\/><\/figure>\n\n\n\n<p>Step 1: Go to your drupal administration page and open <strong>Extend<\/strong> page.<\/p>\n\n\n\n<p>Step 2: In the <strong>Extend<\/strong> page click <strong>Install new module<\/strong> button. if you cant find the link button, enable the <strong>Update manager<\/strong> module from your module list. now you can see the <strong>Install new module<\/strong> link in the page.<\/p>\n\n\n\n<p>Step 3: Use browse button and upload the downloaded ZIP file to install the module.<\/p>\n\n\n<div class=\"ads-row\">\n\t<div class=\"ads-column0\">\n\t\t<script async src=\"\/\/pagead2.googlesyndication.com\/pagead\/js\/adsbygoogle.js\"><\/script>\n\t\t<!-- Joomla Page Center 3 -->\n\t\t<ins class=\"adsbygoogle\"\n\t\t\t style=\"display:inline-block;width:336px;height:280px\"\n\t\t\t data-ad-client=\"ca-pub-6676019656533652\"\n\t\t\t data-ad-slot=\"4975101454\"><\/ins>\n\t\t<script>\n\t\t(adsbygoogle = window.adsbygoogle || []).push({});\n\t\t<\/script>\n\t<\/div>\n<\/div>\n\n\n\n<h2 class=\"wp-block-heading\">Module configuration<\/h2>\n\n\n\n<p>1. Go to Admin &gt;&gt; <strong>Extend<\/strong> page and check the <strong>Enabled<\/strong> check box near to the module <strong>Horizontal image scrolling<\/strong> and then click the <strong>Install<\/strong> button at the bottom.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"http:\/\/www.gopiplus.com\/extensions\/my-plugin\/screens\/drupal\/horizontal_image_scrolling\/horizontal_image_scrolling_enable_module.png\" alt=\"How to enable horizontal image scrolling drupal module \"\/><\/figure>\n\n\n\n<p>2. Go to Admin &gt;&gt; Structure &gt;&gt; Block layout page, there you can see button called <strong>Place Block<\/strong> near each available blocks.<\/p>\n\n\n\n<p>3. Go to Admin &gt;&gt; Structure &gt;&gt; Blocks layout page and click <strong>Place Block<\/strong> button to add Block. If you want to add Block in your <strong>Breadcrumb<\/strong>, click <strong>Place Block<\/strong> button near your <strong>Breadcrumb<\/strong> title. It will open <strong>Place block<\/strong> window. In that window again click <strong>Place Block<\/strong> button near <strong>Horizontal image scrolling<\/strong>.<\/p>\n\n\n\n<p>4. Now open your website front end and see <strong>Horizontal image scrolling<\/strong> module in the selected location. go to configuration link of the module and update the default text message.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Block configuration<\/h2>\n\n\n\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"http:\/\/www.gopiplus.com\/extensions\/my-plugin\/screens\/drupal\/horizontal_image_scrolling\/horizontal_image_scrolling_configure_block.png\" alt=\"horizontal image scrolling drupal module block configure\"\/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Download location<\/h2>\n\n\n\n<p><a href=\"http:\/\/www.gopiplus.com\/extensions\/2017\/04\/drupal-module-horizontal-image-scrolling-download-link\/\">http:\/\/www.gopiplus.com\/extensions\/2017\/04\/drupal-module-horizontal-image-scrolling-download-link\/<\/a><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Module official page with live demo<\/h2>\n\n\n\n<p><a href=\"http:\/\/www.gopiplus.com\/extensions\/2017\/04\/drupal-module-horizontal-image-scrolling\/\">http:\/\/www.gopiplus.com\/extensions\/2017\/04\/drupal-module-horizontal-image-scrolling\/<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Horizontal image scrolling module display and scroll the images in horizontal style, scroll will start automatically. Slideshow will pause on mouse over. In the admin we have option to enter WIDTH and HEIGHT of the galley. Also we have option to enter image URL. Features of this module 1. Easy to customize.2. Support all browser.3. [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[41],"tags":[40,18,8,6],"class_list":["post-1684","post","type-post","status-publish","format-standard","hentry","category-drupal-module","tag-drupal","tag-image","tag-module","tag-scrolling"],"amp_enabled":true,"_links":{"self":[{"href":"http:\/\/www.gopiplus.com\/extensions\/wp-json\/wp\/v2\/posts\/1684","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/www.gopiplus.com\/extensions\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/www.gopiplus.com\/extensions\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/www.gopiplus.com\/extensions\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/www.gopiplus.com\/extensions\/wp-json\/wp\/v2\/comments?post=1684"}],"version-history":[{"count":0,"href":"http:\/\/www.gopiplus.com\/extensions\/wp-json\/wp\/v2\/posts\/1684\/revisions"}],"wp:attachment":[{"href":"http:\/\/www.gopiplus.com\/extensions\/wp-json\/wp\/v2\/media?parent=1684"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/www.gopiplus.com\/extensions\/wp-json\/wp\/v2\/categories?post=1684"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/www.gopiplus.com\/extensions\/wp-json\/wp\/v2\/tags?post=1684"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}