Image horizontal reel scroll slideshow Shortcode

Below, you’ll find a detailed guide on how to add the Image horizontal reel scroll slideshow Shortcode to your WordPress website, including its parameters, examples, and PHP function code. Additionally, we’ll assist you with common issues that might cause the Image horizontal reel scroll slideshow Plugin shortcode not to show or not to work correctly.

Before starting, here is an overview of the Image horizontal reel scroll slideshow Plugin and the shortcodes it provides:

Plugin Icon
Image horizontal reel scroll slideshow

"Image Horizontal Reel Scroll Slideshow is a unique WordPress plugin that allows you to beautifully display your images in a continuous horizontal scroll, creating a reel-like slideshow effect."

★★★☆✩ (26) Active Installs: 5000+ Tested with: 6.1.4 PHP Version: false
Included Shortcodes:
  • [ihrss-gallery]

Image horizontal reel scroll slideshow [ihrss-gallery] Shortcode

The Image Horizontal Reel Scroll Slideshow (IHRSS) shortcode is used to create a customizable, horizontal image slideshow. It fetches images from a specified gallery, allowing adjustments for features like speed, background color, gap, and random display.

Shortcode: [ihrss-gallery]

Parameters

Here is a list of all possible ihrss-gallery shortcode parameters and attributes:

  • type – The group name of the images to be displayed.
  • height – The height of the image slideshow in pixels.
  • speed – The speed of the image slideshow transition.
  • bgcolor – The background color of the image slideshow.
  • gap – The gap or space between images in the slideshow.
  • random – Determines if the images should be displayed randomly.

Examples and Usage

Basic example – Displaying an image gallery with the default settings

[ihrss-gallery type="GROUP1" /]

Advanced examples

Displaying an image gallery with custom height, speed, background color, gap between images, and image order set to random.

[ihrss-gallery type="GROUP1" height="300" speed="2" bgcolor="#000000" gap="20" random="YES" /]

Displaying an image gallery with a different type, custom height, and speed.

[ihrss-gallery type="GROUP2" height="200" speed="3" /]

Displaying an image gallery with custom height, speed, and gap between images, but with the default background color and image order.

[ihrss-gallery type="GROUP1" height="250" speed="1" gap="15" /]

PHP Function Code

In case you have difficulties debugging what causing issues with [ihrss-gallery] shortcode, check below the related PHP functions code.

Shortcode line:

add_shortcode( 'ihrss-gallery', 'Ihrss_shortcode' );

Shortcode PHP function:

function Ihrss_shortcode( $atts ) {
	global $wpdb;
	$Ihrss = "";
	$Ihrss_package = "";
	$Ihrss_package1 = "";
	
	//[ihrss-gallery type="GROUP1" height="170" speed="1" bgcolor="#FFFFFF" gap="10" random="YES"]
	if ( ! is_array( $atts ) ) { 
		return ''; 
	}
	
	$Ihrss_type = isset($atts['type']) ? $atts['type'] : '';
	$Ihrss_sliderwidth = 98;
	$Ihrss_slidespeed = isset($atts['speed']) ? $atts['speed'] : '';	
	$Ihrss_slidebgcolor = isset($atts['bgcolor']) ? $atts['bgcolor'] : '';	
	$Ihrss_slideshowgap = isset($atts['gap']) ? $atts['gap'] : '';	
	$Ihrss_random = isset($atts['random']) ? $atts['random'] : '';
	$Ihrss_sliderheight = isset($atts['h']) ? $atts['h'] : '';
	if($Ihrss_sliderheight == '') {
		$Ihrss_sliderheight = isset($atts['height']) ? $atts['height'] : '';
	}
	
	if(!is_numeric($Ihrss_sliderheight)) { 
		$Ihrss_sliderheight = 200; 
	}
	
	if(!is_numeric($Ihrss_slidespeed)) { 
		$Ihrss_slidespeed = 1; 
	}
	
	if(!is_numeric($Ihrss_slideshowgap)) { 
		$Ihrss_slideshowgap = 10; 
	}
	
	$Ihrss_slideshowgaphtml = "box-shadow: 0px 0px 0px 0px;padding-right:" . $Ihrss_slideshowgap . "px;";
	
	$sSql = "select Ihrss_path,Ihrss_link,Ihrss_target,Ihrss_title from ".WP_Ihrss_TABLE." where 1=1";
	
	if($Ihrss_type <> "") { 
		$sSql = $sSql . " and Ihrss_type = %s "; 
		$sSql = $wpdb->prepare($sSql, $Ihrss_type);
	}
	
	if($Ihrss_random == "YES") { 
		$sSql = $sSql . " ORDER BY RAND()"; 
	}
	else { 
		$sSql = $sSql . " ORDER BY Ihrss_order"; 
	}
	
	$data = $wpdb->get_results($sSql);
	
	$cnt = 0;
	if ( ! empty($data) ) {
		foreach ( $data as $data ) {
			$Ihrss_path = trim($data->Ihrss_path);
			$Ihrss_link = trim($data->Ihrss_link);
			$Ihrss_target = trim($data->Ihrss_target);
			$Ihrss_title = trim($data->Ihrss_title);
			
			$img_package = "";
			$img_package1 = "";
			if($Ihrss_link <> "") { 
				$img_package = $img_package . "<a title=\"$Ihrss_title\" target=\"$Ihrss_target\" href=\"$Ihrss_link\">";
				$img_package = $img_package . "<img style=\"display:inline;max-width: none;$Ihrss_slideshowgaphtml\" alt=\"$Ihrss_title\" src=\"$Ihrss_path\" />";
				$img_package = $img_package . "</a>";
			}
			else {
				$img_package = $img_package . "<img style=\"display:inline;max-width: none;$Ihrss_slideshowgaphtml\" alt=\"$Ihrss_title\" src=\"$Ihrss_path\" />";
			}
			
			$Ihrss_package = $Ihrss_package . "IHRSS_SLIDESRARRAY[$cnt]='" . $img_package . "';	";
			
			// Dummy Array with style change.
			$img_package1 = $img_package1 . "<img style=\"display: none;max-width: none;\" src=\"$Ihrss_path\" />";
			$Ihrss_package1 = $Ihrss_package1 . "IHRSS_SLIDESRARRAY1[$cnt]='" . $img_package1 . "';	";
			
			$cnt++;
		}
		
		$Ihrss_pluginurl = WP_IHRSS_PLUGIN_URL;
	
		$Ihrss = $Ihrss .'<script language="JavaScript1.2">';
		$Ihrss = $Ihrss .'var IHRSS_WIDTH = "' . $Ihrss_sliderwidth . '%"; ';
		$Ihrss = $Ihrss .'var IHRSS_HEIGHT = "' . $Ihrss_sliderheight . 'px"; ';
		$Ihrss = $Ihrss .'var IHRSS_SPEED = ' . $Ihrss_slidespeed . '; ';
		$Ihrss = $Ihrss .'var IHRSS_BGCOLOR = "' . $Ihrss_slidebgcolor . '"; ';
		$Ihrss = $Ihrss .'var IHRSS_SLIDESRARRAY=new Array(); ';
		$Ihrss = $Ihrss .'var IHRSS_SLIDESRARRAY1=new Array(); ';
		$Ihrss = $Ihrss .'var IHRSS_FINALSLIDE = " "; ';
		$Ihrss = $Ihrss .$Ihrss_package;
		$Ihrss = $Ihrss .$Ihrss_package1;
		$Ihrss = $Ihrss .'var IHRSS_IMGGAP = ""; ';
		$Ihrss = $Ihrss .'var IHRSS_PIXELGAP = 0; ';
		$Ihrss = $Ihrss .'</script>';
		$Ihrss = $Ihrss .'<script language="JavaScript1.2" src="' . $Ihrss_pluginurl . '/image-horizontal-reel-scroll-slideshow.js"></script>';
	}	
	else {
		$Ihrss = $Ihrss . __('No images available in this Gallery Type. Please check admin setting.', 'image-horizontal-reel-scroll-slideshow');
	}
	return $Ihrss;
}

Code file location:

image-horizontal-reel-scroll-slideshow/image-horizontal-reel-scroll-slideshow/image-horizontal-reel-scroll-slideshow.php

Conclusion

Now that you’ve learned how to embed the Image horizontal reel scroll slideshow Plugin shortcode, understood the parameters, and seen code examples, it’s easy to use and debug any issue that might cause it to ‘not work’. If you still have difficulties with it, don’t hesitate to leave a comment below.

Comments

Leave a Reply

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