Wordpress Themes - WP Forum at BFA
Click here to register or to donate.
Auto self-registration is not available here - far too many spammers. This forum has many, many backlinks and because of that there is an intense desire among spammers to drop their links here.

Wordpress Themes - WP Forum at BFA » WordPress Themes » Atahualpa 3 Wordpress theme » Sidebars & Widgets »

[SOLVED] Javascript not working in widget sidebar


  #1  
Old Apr 28, 2010, 04:49 AM
marj318
 
3 posts · Jan 2010
Hi -

I'm trying to set up a tabbed menu on the sidebar. Tried a few others, including Tabbed Widgets and Section Widget, and came across the same stone wall: javascript doesn't appear to work in the sidebars.

I've deactivated all my other plugins in case one of them may be causing the problem, but no....

Currently, I'm playing with NetTut's jQuery Tabbed Interface example.

My test page shows the tabbed menu working in the main content section of the post. However, the same code in the text widget on the same page doesn't work (although the CSS works fine!).

I've got this test page going on 2 separate websites, both using Wordpress 2.9.2 and Atahualpa 3.4.6.

Apart from the plugins that I've tried, this is my second attempt at doing a tabbed menu the hard way. I've run out of ideas of why they don't work. Please help!

Thank you for your help in advance!
  #2  
Old Apr 28, 2010, 08:39 AM
juggledad's Avatar
juggledad
 
23,684 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
try this, use this in the CSS Inserts
HTML Code:
    div#tabvanilla {
    width: 300px !important;
    margin: 0px !important;
    padding: 10px !important;
    background: #f3f1eb !important;
    border: 1px solid #dedbd1 !important;
    margin-bottom: 15px !important;
    }

    div#tabvanilla a {
    color: #222 !important;
    text-decoration: none !important;
    }

    div#tabvanilla a:hover {
    color: #009 !important;
    text-decoration: underline !important;
    }

    .tabnav li {
    display: inline !important;
    list-style: none !important;
    padding-right: 5px !important;
    }

    .tabnav li a {
    text-decoration: none !important;
    text-transform: uppercase !important;
    color: #222 !important;
    font-weight: bold !important;
    padding: 4px 6px !important;
    outline: none !important;
    }

    .tabnav li a:hover, .tabnav li a:active, .tabnav li.ui-tabs-selected a {
    background: #dedbd1 !important;
    color: #222 !important;
    text-decoration: none !important;
    }

    .tabdiv {
    margin-top: 2px !important;
    background: #fff !important;
    border: 1px solid #dedbd1 !important;
    padding: 5px !important;
    }

    .tabdiv li {
    list-style-image: url("star.png") !important;
    margin-left: 20px !important;
    }

    .ui-tabs-hide {
    display: none !important;
    }
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #3  
Old Apr 28, 2010, 07:49 PM
marj318
 
3 posts · Jan 2010
Hi Jugglehead -

Thanks for your quick reply.

It fixed the problem about the tab titles themselves - so that they now display on one line.

For the tab content.... no joy.

I'm using the Chrome Developer Tools (right-click on the element within Chrome, and select Inspect Element). For the tab menu on the post content, I notice that the javascript adds various classes to the elements, including 'ui-tabs-selected', 'ui-tabs-nave', ui-tabs-hide'.

However, the tab menu on the sidebar doesn't get the same treatment.
  #4  
Old Apr 29, 2010, 07:01 AM
juggledad's Avatar
juggledad
 
23,684 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
Have you been making changes to the css.php?

Please set your CSS to Internal and CSS: Compress to NO at ATO->Configure CSS & JS
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #5  
Old Apr 30, 2010, 06:59 AM
marj318
 
3 posts · Jan 2010
This is my D-O-H-! moment.

Everything works fine now. Nothing was wrong with the Javascript or CSS or widget sidebar.

I'm learning to write plugins using wp_enqueue_script and wp_enqueue_style, and I was trying to be clever and restrict the code to a particular page ie if (is_single('47')). For some reason, the widget sidebar didn't consider itself to be part of that particular page.

I think that's what happened because all worked fine after I changed it to if (!is_admin()).

Thanks very much for your help and quick response, Jugglehead!

Much appreciated.

Bookmarks

Tags
javascript, sidebar problems, widget

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
Sidebar Widget Title coloring not working properly Velma Sidebars & Widgets 7 May 30, 2012 12:17 AM
Following widget not working properly, followers working marced Sidebars & Widgets 0 Apr 4, 2010 06:01 AM
WP Menu Manager javascript not working? devarah Plugins & Atahualpa 1 Feb 7, 2010 06:37 PM
How do I place Feedjit (or other Javascript) in the sidebar? Radish Sidebars & Widgets 2 Jul 16, 2009 09:56 AM
Left Sidebar css and javascript. Right sidebar tabs. Not visible or configurable. jinglebells New Versions, & Updating 2 Jun 6, 2009 10:22 PM


All times are GMT -6. The time now is 05:26 PM.


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