Rotating image
Permalink Browser Info Environment
Can the large image on the home page be a rotating image?
| Type: | Pre-Sale |
|---|---|
| Status: | Resolved |
Thanks so much.. I am pretty savvy with the back-end stuff. I would love to make this happen sooner than later (not sure what "a short while" would be).
I can have everything loaded in a few days and ready to roll with most of it.
I can have everything loaded in a few days and ready to roll with most of it.
Hey Sungraphics,
Totally forgot to follow up here, but did you by chance successfully implement your image slideshow on your LOFT website? I'm noticed I had 1-2 open support cases and this was one of them.
Also, I love seeing the websites built with LOFT, if you ended up using it would you mind sending me the link to your site?
Thanks so much, hope all has been well!
- Jordan
Totally forgot to follow up here, but did you by chance successfully implement your image slideshow on your LOFT website? I'm noticed I had 1-2 open support cases and this was one of them.
Also, I love seeing the websites built with LOFT, if you ended up using it would you mind sending me the link to your site?
Thanks so much, hope all has been well!
- Jordan
Hey Sungraphics,
In that case here's what you'll have to do.
1.) Ensure you DO NOT have the 'main masthead image' page attribute defined on your home page.
2.) Add the following code snippet directly above the '<?php $this->inc('elements/footer.php');?>' line in the /packages/loft/themes/loft/home.php file. Obviously swap out my fake image URL's with the URL's to your images you want in the slider.
<script type="text/javascript">
$(document).ready(function(){
$("#mastheadContainer").backstretch([
"<?php echo $this->getThemePath(); ?>/images/header1.png",
"<?php echo $this->getThemePath(); ?>/images/header2.png",
"<?php echo $this->getThemePath(); ?>/images/header3.png"
], {duration: 5000, fade: 750 });
});
</script>
The 'duration' is how long the image will show and the 'fade' is how long the fade animation will take.
Please let me know if this works for you or if I can help further with this.
- Jordan
In that case here's what you'll have to do.
1.) Ensure you DO NOT have the 'main masthead image' page attribute defined on your home page.
2.) Add the following code snippet directly above the '<?php $this->inc('elements/footer.php');?>' line in the /packages/loft/themes/loft/home.php file. Obviously swap out my fake image URL's with the URL's to your images you want in the slider.
<script type="text/javascript">
$(document).ready(function(){
$("#mastheadContainer").backstretch([
"<?php echo $this->getThemePath(); ?>/images/header1.png",
"<?php echo $this->getThemePath(); ?>/images/header2.png",
"<?php echo $this->getThemePath(); ?>/images/header3.png"
], {duration: 5000, fade: 750 });
});
</script>
The 'duration' is how long the image will show and the 'fade' is how long the fade animation will take.
Please let me know if this works for you or if I can help further with this.
- Jordan
Yes this is indeed possible, however, I have not yet built this into my theme. I have implemented this quite easily on another website:
http://holderoftheyear.org
Couple options here:
1.) I'm happy to assist and potentially hook this up in the one instance you might need it. Probably wouldn't take more than 1 hour.
2.) If you can wait just a while I can schedule some time to build in the functionality that will allow users to have an image file set loop through in image slider fashion within my LOFT theme in the C5 marketplace. Then you should only have to download an updated copy of LOFT through your own website.
Please let me know if either of these options is appealing to you or if you have any other alternative solutions to your issue that I may help with.
Look forward to hearing from you,
Jordan Santaga