Wordpress Themes - WP Forum at BFA
Click Here To DONATE! Support the theme development, get more attention and additional benefits based on your donation level. Your forum name will be highlighted.

Wordpress Themes - WP Forum at BFA » WordPress Themes » Atahualpa 3 Wordpress theme » Header configuration & styling »

Moving Spry Widget from Dreamweaver CS5 to ATA


Build custom WP THEMES, without
coding.
Click here for THEMEFRAME

From the author of Atahualpa, the #1 most
downloaded (700,000+) theme @ wordpress.org
  #1  
Old Jan 4, 2011, 10:23 PM
IldiW
 
39 posts · Oct 2010
NZ
Hi,
I've been given valuable advice here many times, I'm hoping someone can help me out again!
I'm trying to insert some JavaScript files and it doesn't work. Bearing in mind that I know nothing about JS it's mainly a trial and error thing... What I'm trying to achieve is to use a Spry UI Content Slideshow widget from Dreamweaver CS5 for rotating images with links. I have it all working in DW but due to lack of understanding I must be inserting it to the wrong places...

At the moment I have this on the homepage as HTML:

<div id="ImageSlideShow">
<div class="article">
<div class="photo"> <img src="http://79.170.44.110/westaucklandparents.org.nz/wp-content/themes/atahualpa/images/tabs/image1.jpg" alt="Antenatal course" />
<div class="caption">Antenatal Courses</div>
</div>
<div class="story">
<div class="banner">
<div class="title">98% of our members</div>
<div class="subTitle">would recommend our Antenatal Courses!</div>
</div>
<div class="content">
<p>Our courses are designed to meet the needs of parents-to-be, covering everything from choosing a midwife to first days with the new baby.</p>
<button type="button"><span><span><span>Click for Details</span></span></span></button>
</div>
[There's three more images, text, etc here, just wanted to save some space with not showing them.]
</div>

I have the following in ATO:
HTML inserts header:
<link href="http://79.170.44.110/westaucklandparents.org.nz/wp-content/themes/atahualpa/ SpryAssets/Spry-UI-1.7/css/ContentSlideShow/wanderlust/wanderlust-brown.css" rel="stylesheet" type="text/css" />
<script src="http://79.170.44.110/westaucklandparents.org.nz/wp-content/themes/atahualpa/ SpryAssets/Spry-UI-1.7/includes/SpryDOMUtils.js" type="text/javascript"></script>
<script src="http://79.170.44.110/westaucklandparents.org.nz/wp-content/themes/atahualpa/ SpryAssets/Spry-UI-1.7/includes/SpryDOMEffects.js" type="text/javascript"></script>
<script src="http://79.170.44.110/westaucklandparents.org.nz/wp-content/themes/atahualpa/ SpryAssets/Spry-UI-1.7/includes/SpryWidget.js" type="text/javascript"></script>
<script src="http://79.170.44.110/westaucklandparents.org.nz/wp-content/themes/atahualpa/ SpryAssets/Spry-UI-1.7/includes/SpryPanelSelector.js" type="text/javascript"></script>
<script src="http://79.170.44.110/westaucklandparents.org.nz/wp-content/themes/atahualpa/ SpryAssets/Spry-UI-1.7/includes/SpryPanelSet.js" type="text/javascript"></script>
<script src="http://79.170.44.110/westaucklandparents.org.nz/wp-content/themes/atahualpa/ SpryAssets/Spry-UI-1.7/includes/SpryFadingPanels.js" type="text/javascript"></script>
<script src="http://79.170.44.110/westaucklandparents.org.nz/wp-content/themes/atahualpa/ SpryAssets/Spry-UI-1.7/includes/SpryContentSlideShow.js" type="text/javascript"></script>
<script type="text/xml">
<!--
<oa:widgets>
<oa:widget wid="2141541" binding="#ImageSlideShow" />
</oa:widgets>
-->
</script>

HTML insert body bottom:
<script type="text/javascript">
// BeginOAWidget_Instance_2141541: #ImageSlideShow

var ImageSlideShow = new Spry.Widget.ContentSlideShow("#ImageSlideShow", {
widgetClass: "WLBSlideShow",
displayInterval: 4000,
transitionDuration: 2000
});

// EndOAWidget_Instance_2141541
</script>

I think I have ftpd all the relevant files to the site, so I don't think that's the problem.
The link to the site (which is in testing at the moment):
http://79.170.44.110/westaucklandparents.org.nz/

Many thanks!
Ildi
  #2  
Old Jan 5, 2011, 04:34 AM
juggledad's Avatar
juggledad
 
22,317 posts · Mar 2009
OSX 10.8.5 WP 3.8.x Atahualpa 3.7.x Safari 6.x Firefox 25 XP
After looking at the page, I get a bunch of not found's for files. Notice the space '.../atahualpa/ SpryAssets/....'? it shouldn't be there - it causes the file to be not found
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #3  
Old Jan 5, 2011, 02:58 PM
IldiW
 
39 posts · Oct 2010
NZ
Oh, you're right! This did help! For the benefit of others potentially struggling with the same, my final (and working version) is like this:
HTML Insert Header:
<link href="http://79.170.44.110/westaucklandparents.org.nz/wp-content/themes/atahualpa/SpryAssets/Spry-UI-1.7/css/ContentSlideShow/wanderlust/wanderlust-brown.css" rel="stylesheet" type="text/css" />
<script src="http://79.170.44.110/westaucklandparents.org.nz/wp-content/themes/atahualpa/SpryAssets/Spry-UI-1.7/includes/SpryDOMUtils.js" type="text/javascript"></script>
<script src="http://79.170.44.110/westaucklandparents.org.nz/wp-content/themes/atahualpa/SpryAssets/Spry-UI-1.7/includes/SpryDOMEffects.js" type="text/javascript"></script>
<script src="http://79.170.44.110/westaucklandparents.org.nz/wp-content/themes/atahualpa/SpryAssets/Spry-UI-1.7/includes/SpryWidget.js" type="text/javascript"></script>
<script src="http://79.170.44.110/westaucklandparents.org.nz/wp-content/themes/atahualpa/SpryAssets/Spry-UI-1.7/includes/SpryPanelSelector.js" type="text/javascript"></script>
<script src="http://79.170.44.110/westaucklandparents.org.nz/wp-content/themes/atahualpa/SpryAssets/Spry-UI-1.7/includes/SpryPanelSet.js" type="text/javascript"></script>
<script src="http://79.170.44.110/westaucklandparents.org.nz/wp-content/themes/atahualpa/SpryAssets/Spry-UI-1.7/includes/SpryFadingPanels.js" type="text/javascript"></script>
<script src="http://79.170.44.110/westaucklandparents.org.nz/wp-content/themes/atahualpa/SpryAssets/Spry-UI-1.7/includes/SpryContentSlideShow.js" type="text/javascript"></script>
<script type="text/xml">
<!--
<oa:widgets>
<oa:widget wid="2141541" binding="#ImageSlideShow" />
</oa:widgets>
-->
</script>

HTML Insert Body Bottom:
<script type="text/javascript">
// BeginOAWidget_Instance_2141541: #ImageSlideShow

var ImageSlideShow = new Spry.Widget.ContentSlideShow("#ImageSlideShow", {
widgetClass: "WLBSlideShow",
autoPlay: true,
displayInterval: 4000,
transitionDuration: 2000,
});

// EndOAWidget_Instance_2141541
</script>

and in the HTML for the page I only have the divs now.

However, it only works in Firefox not in Explorer 8... Any ideas on this issue?

Thanks again!
Ildi
  #4  
Old Jan 6, 2011, 11:41 PM
IldiW
 
39 posts · Oct 2010
NZ
Unfortunately this question seems to be beyond my feeble knowledge and I'm stuck. It appears that sadly the majority of the people using this community page are still using IE ('sigh') so I have to move on. Again for the benefit of others interested in the same thing (rotating images with links) I'm now using a plugin which is super-easy to use and works perfectly in all browsers (http://www.nathanrice.net/plugins/wp-cycle/).
Thanks again for the help all the way supporting my work!

Bookmarks

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
Dreamweaver and ATO/WP Dona Atahualpa 3 Wordpress theme 6 Sep 12, 2010 05:24 PM
[SOLVED] Atahualpa 3.5.3 and Dreamweaver CS5 BellaMary Forum How-To 11 Aug 23, 2010 01:09 AM
[SOLVED] Problem with moving new widget areas and links? Wimbledon Sidebars & Widgets 0 Jun 9, 2010 06:55 PM
Dreamweaver homepage link problem Dealer Bicycles Atahualpa 3 Wordpress theme 4 Jan 31, 2009 05:38 PM


All times are GMT -6. The time now is 04:41 PM.


Powered by vBulletin® Copyright ©2000 - 2014, Jelsoft Enterprises Ltd.