I have used the MD Slider module (which is Mega Slider, a paid module) in my websites to create slideshows.
But there is no default option to create a link for each slide.
Is there any way to hyperlink a slide?
1 Answer
I have created a patch with the changes to convert a slide into hyperlink. Since I cannot upload a file here, I am copy-pasting the contents of my .patch file:
From 3f72f263b3673ce27ca4114963b007752b566c2a Mon Sep 17 00:00:00 2001
From: Raj Pawan Gumdal <[email protected]>
Date: Sat, 6 Aug 2016 11:02:04 +0530
Subject: [PATCH 1/2] Ported changes regarding MD_Slider done for an older
version
---
.../templates/front/front_layers_render.tpl.php | 13 ++++----
.../templates/front/front_slide_render.tpl.php | 35 ++++++++++++++++++++--
2 files changed, 41 insertions(+), 7 deletions(-)
diff --git a/sites/all/modules/md_slider/templates/front/front_layers_render.tpl.php b/sites/all/modules/md_slider/templates/front/front_layers_render.tpl.php
index a8dd7fc..16c30b4 100644
--- a/sites/all/modules/md_slider/templates/front/front_layers_render.tpl.php
+++ b/sites/all/modules/md_slider/templates/front/front_layers_render.tpl.php
@@ -11,11 +11,14 @@
<?php endif;?>
<div class="<?php print $class; ?>" <?php print $data; ?>>
<?php if ($layer->type == 'text'): ?>
- <?php if (isset($link)):?>
- <a href="<?php print $link;?>"<?php if (isset($layer->link["target"]) && !empty($layer->link["target"])) print " target='{$layer->link["target"]}'";?>><?php print $layer->title;?></a>
- <?php else:?>
- <?php print $layer->title;?>
- <?php endif; ?>
+ <?php /* Raj: Changes to make MD_Slider slide as hyperlink */?>
+ <?php if (strpos($layer->title,'URL:') === false):?>
+ <?php if (isset($link)):?>
+ <a href="<?php print $link;?>"<?php if (isset($layer->link["target"]) && !empty($layer->link["target"])) print " target='{$layer->link["target"]}'";?>><?php print $layer->title;?></a>
+ <?php else:?>
+ <?php print $layer->title;?>
+ <?php endif; ?>
+ <?php endif; ?>
<?php elseif ($layer->type == 'image'): ?>
<?php if (isset($link)):?>
<a href="<?php print $link;?>"<?php if (isset($layer->link["target"]) && !empty($layer->link["target"])) print " target='{$layer->link["target"]}'";?>>
diff --git a/sites/all/modules/md_slider/templates/front/front_slide_render.tpl.php b/sites/all/modules/md_slider/templates/front/front_slide_render.tpl.php
index 8df2c39..5dd71dd 100644
--- a/sites/all/modules/md_slider/templates/front/front_slide_render.tpl.php
+++ b/sites/all/modules/md_slider/templates/front/front_slide_render.tpl.php
@@ -18,10 +18,41 @@
<div class="md-slider-overlay" style="background: <?php print $slide->settings['background_overlay']; ?>">
</div>
<?php endif; ?>
- <div class="md-objects">
+
+ <?php
+ // Raj: Check if there is a string which starts from "URL:". If so, extract the URL and make this div a hyperlink
+ $hasURL = false;
+ $URLString = '';
+ foreach ($slide->layers as $index => $layer):
+ $layerTitle = $layer["title"];
+ drupal_set_message("Layer object: $layer");
+ drupal_set_message("Layer title: $layerTitle");
+ // http://stackoverflow.com/a/4366748/260665
+ if (strpos($layerTitle,'URL:') !== false) {
+ $hasURL = true;
+ $URLString = str_replace('URL:', '', $layerTitle);
+ break;
+ }
+ endforeach;
+
+ if ($hasURL)
+ {
+ print "<a href=$URLString>";
+ }
+ print "<div class=\"md-objects\">";
+ foreach ($slide->layers as $index => $layer):
+ print theme('front_layers_render', array('index' => $index, 'layer' => $layer));
+ endforeach;
+ print "</div>";
+ if ($hasURL)
+ {
+ print "</a>";
+ }
+ ?>
+<!-- <div class="md-objects"> -->
<?php foreach ($slide->layers as $index => $layer):?>
<?php print theme('front_layers_render', array('index' => $index, 'layer' => $layer));?>
<?php endforeach;?>
- </div>
+<!-- </div> -->
</div>
<?php endif;?>
--
2.7.4 (Apple Git-66)
From 74c3d0644fd505729163d4803c9a0f9cb014e679 Mon Sep 17 00:00:00 2001
From: Raj Pawan Gumdal <[email protected]>
Date: Sat, 6 Aug 2016 14:04:39 +0530
Subject: [PATCH 2/2] Finalized the changes to support hyperlinking whole slide
---
.../templates/front/front_slide_render.tpl.php | 30 +++++++++++++---------
sites/all/themes/IndianSnakes/css/custom.css | 6 +++++
2 files changed, 24 insertions(+), 12 deletions(-)
diff --git a/sites/all/modules/md_slider/templates/front/front_slide_render.tpl.php b/sites/all/modules/md_slider/templates/front/front_slide_render.tpl.php
index 5dd71dd..764d46e 100644
--- a/sites/all/modules/md_slider/templates/front/front_slide_render.tpl.php
+++ b/sites/all/modules/md_slider/templates/front/front_slide_render.tpl.php
@@ -9,6 +9,7 @@
<?php if (!isset($slide->settings["disabled"]) || !$slide->settings["disabled"]):?>
<div class="md-slide-item slide-<?php print $index+1;?>" <?php print $data_properties;?>>
+
<div class="md-mainimg" style="<?php print $background_style;?>">
<?php if (!empty($background_url)):?>
<img src="<?php print $background_url;?>" alt="<?php print htmlentities($slide->settings["background_image_alt"], ENT_QUOTES, 'UTF-8');?>"<?php print $background_style;?> />
@@ -25,34 +26,39 @@
$URLString = '';
foreach ($slide->layers as $index => $layer):
$layerTitle = $layer["title"];
- drupal_set_message("Layer object: $layer");
- drupal_set_message("Layer title: $layerTitle");
+// drupal_set_message("Layer object: $layer");
+// drupal_set_message("Layer title: $layerTitle");
// http://stackoverflow.com/a/4366748/260665
- if (strpos($layerTitle,'URL:') !== false) {
+ if (strpos($layerTitle,'URL:') === false) {
+ }
+ else {
$hasURL = true;
- $URLString = str_replace('URL:', '', $layerTitle);
+ $URLString = str_replace('URL:','',$layerTitle);
break;
}
endforeach;
-
+// drupal_set_message("URL: $URLString");
+// drupal_set_message("Has URL: $hasURL");
+ $outputString = "";
if ($hasURL)
{
- print "<a href=$URLString>";
+ $outputString .= "<a href=$URLString >";
}
- print "<div class=\"md-objects\">";
+ $outputString .= "<div class=\"md-objects\">";
foreach ($slide->layers as $index => $layer):
- print theme('front_layers_render', array('index' => $index, 'layer' => $layer));
+ $outputString .= theme('front_layers_render', array('index' => $index, 'layer' => $layer));
endforeach;
- print "</div>";
+ $outputString .= "</div>";
if ($hasURL)
{
- print "</a>";
+ $outputString .= "</a>";
}
+ print $outputString;
?>
-<!-- <div class="md-objects"> -->
+<!-- <div class="md-objects">
<?php foreach ($slide->layers as $index => $layer):?>
<?php print theme('front_layers_render', array('index' => $index, 'layer' => $layer));?>
<?php endforeach;?>
-<!-- </div> -->
+</div> -->
</div>
<?php endif;?>
diff --git a/sites/all/themes/IndianSnakes/css/custom.css b/sites/all/themes/IndianSnakes/css/custom.css
index 3d69b0d..3f0354e 100644
--- a/sites/all/themes/IndianSnakes/css/custom.css
+++ b/sites/all/themes/IndianSnakes/css/custom.css
@@ -27,3 +27,9 @@ display: inline-block;
width: auto !important;
height: 300px !important;
}
+
+/* Reset the hyperlink style to normal inside slides */
+.md-slide-item a {
+ color: inherit;
+ text-decoration: inherit;
+}
\ No newline at end of file
--
2.7.4 (Apple Git-66)
I have defined a new "URL:" label protocol for each slide. If a slide has this label defined then the whole slide's div is converted into hyperlink with whatever link is provided after my URL: protocol. For example check this:
The code (patch) is configured such that label with text which begins with URL: is never rendered as text but it is used to convert the slide into a hyperlink.
For a live working example check: http://indiansnakes.org/homepage
Assumption: The only limitation of this method is, you should not hyperlink any text or images which are used within this hyperlinked slide coz the anchor tags cannot be nested, apparently.
Edit: I thought its best to update the patch details in the MD Slider community as well, here it is: http://megadrupal.com/comment/13066#comment-13066
Also a gist is created with the contents of same patch: https://gist.github.com/gumdal/e580cd80199c871fa52f677538771551
MD Slidermodule... are you referring to Mega Slider?