WordPress.org

Forums

problem with nifty cube and wordpress (7 posts)

  1. Phartog
    Member
    Posted 6 years ago #

    I want to use niftycube to round some widgets and images in my theme, but I can't get it to work. I see the text in the sub-page-menu widget shifting down a couple of pixels but the widget doesn't get round corners. I added the the script to my header like this:

    <script src="<?php bloginfo('stylesheet_directory'); ?>/Niftycube/niftycube.js" type="text/javascript"></script>
    
    <script type="text/javascript">
    		window.onload=function(){
    		Nifty("li#sub-page-menu","normal");
    		}
    </script>
  2. mccormicky
    Member
    Posted 6 years ago #

    Here are 3 troubleshooters:

    Open the niftycube.js file.See where it says href?- make sure this is right in your file.
    Sometimes you have to put in the link to the nifty.css style sheet.

    function AddCss(){
    niftyCss=true;
    var l=CreateEl("link");
    l.setAttribute("type","text/css");
    l.setAttribute("rel","stylesheet");
    l.setAttribute("href","<?php bloginfo('stylesheet_directory'); ?>/Niftycube/niftyCorners.css");
    l.setAttribute("media","screen");
    document.getElementsByTagName("head")[0].appendChild(l);
    }

    Try adding padding to the divs you want to round,too.
    View your page source to make sure you have the link to the javascript right.

    function AddCss(){
    niftyCss=true;
    var l=CreateEl("link");
    l.setAttribute("type","text/css");
    l.setAttribute("rel","stylesheet");
    l.setAttribute("href","<?php bloginfo('stylesheet_directory'); ?>/Niftycube/niftyCorners.css");
    l.setAttribute("media","screen");
    document.getElementsByTagName("head")[0].appendChild(l);
    }
  3. Phartog
    Member
    Posted 6 years ago #

    Thanks for the reaction but it is still not working. I did what you said, I checked the niftycube.js file and changed the link to:

    function AddCss(){
    niftyCss=true;
    var l=CreateEl("link");
    l.setAttribute("type","text/css");
    l.setAttribute("rel","stylesheet");
    l.setAttribute("href","<?php bloginfo('stylesheet_directory'); ?>/NiftyCube/niftyCorners.css");
    l.setAttribute("media","screen");
    document.getElementsByTagName("head")[0].appendChild(l);
    }

    It still didn't work. I checked the link in my head to the javascript files and I changed the padding. I think a "normal" setting in niftycube gives rounded corners of 5px, so I tried a padding of 10 px and also of 15px, both didn't work. I really don't know what to do. I am not sure if I linked to the searchbox the right way. Here is my html:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head profile="http://gmpg.org/xfn/11">
    
    	<title>AID INDIA &raquo; Where we work</title>
    
    	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    	<meta name="generator" content="WordPress 2.7.1" /> <!-- leave this for stats please -->
    
    	<link rel="stylesheet" href="http://localhost/wordpress/wp-content/themes/AID INDIA website/style.css" type="text/css" media="screen" />
    	<link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="http://localhost/wordpress/feed/" />
    
    	<link rel="alternate" type="text/xml" title="RSS .92" href="http://localhost/wordpress/feed/rss/" />
    	<link rel="alternate" type="application/atom+xml" title="Atom 0.3" href="http://localhost/wordpress/feed/atom/" />
    	<link rel="pingback" href="http://localhost/wordpress/xmlrpc.php" />
    
    	<script src="http://localhost/wordpress/wp-content/themes/AID INDIA website/smoothgallery/scripts/mootools.js" type="text/javascript"></script>
    	<script src="http://localhost/wordpress/wp-content/themes/AID INDIA website/smoothgallery/scripts/jd.gallery.js" type="text/javascript"></script>
    	<link rel="stylesheet" href="http://localhost/wordpress/wp-content/themes/AID INDIA website/smoothgallery/css/jd.gallery.css" type="text/css" media="screen" />
    
    		<link rel='archives' title='January 2009' href='http://localhost/wordpress/2009/01/' />
    	<link rel='archives' title='December 2008' href='http://localhost/wordpress/2008/12/' />
    
    	<link rel='archives' title='November 2007' href='http://localhost/wordpress/2007/11/' />
    		<meta name='robots' content='noindex,nofollow' />
    <link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://localhost/wordpress/xmlrpc.php?rsd" />
    <link rel="wlwmanifest" type="application/wlwmanifest+xml" href="http://localhost/wordpress/wp-includes/wlwmanifest.xml" /> 
    
    <!-- Multi-level Navigation Plugin v2.1 by PixoPoint Web Development ... http://pixopoint.com/multi-level-navigation/ -->
    <link rel="stylesheet" type="text/css" href="http://localhost/wordpress/wp-content/plugins/multi-level-navigation-plugin/style.php" />
    <script type='text/javascript' src='http://localhost/wordpress/wp-includes/js/jquery/jquery.js?ver=1.2.6'></script>
    <script type='text/javascript' src='http://localhost/wordpress/wp-content/plugins/multi-level-navigation-plugin/scripts/hoverIntent.js.php?ver=r5'></script>
    <script type='text/javascript' src='http://localhost/wordpress/wp-content/plugins/multi-level-navigation-plugin/scripts/superfish.js?ver=1.4.8'></script>
    <script type='text/javascript' src='http://localhost/wordpress/wp-content/plugins/multi-level-navigation-plugin/scripts/superfish_settings.js.php?ver=1.0'></script>
    <meta name="generator" content="WordPress 2.7.1" />
    
    	<script src="http://localhost/wordpress/wp-content/themes/AID INDIA website/NiftyCube/niftycube.js" type="text/javascript"></script>
    	<script src="http://localhost/wordpress/wp-content/themes/AID INDIA website/NiftyCube/niftyLayout.js" type="text/javascript"></script>
    	<link rel="stylesheet" href="http://localhost/wordpress/wp-content/themes/AID INDIA website/NiftyCube/css/niftyCorners.css" type="text/css" media="screen" />
    	<link rel="stylesheet" href="http://localhost/wordpress/wp-content/themes/AID INDIA website/NiftyCube/css/niftyLayout.css" type="text/css" media="screen" />
    
    	<script type="text/javascript">
    		window.onload=function(){
    		Nifty("li#search","big");
    		}
    		</script> 
    
    </head>
    
    <body>
    
    <div id="wrapper">
    
    <img id="header-logo" src="http://localhost/wordpress/wp-content/themes/AID INDIA website/images/header-logo.gif" width="84" height="129" alt="logo AID India"/>
    
    	<div id="header">
    
    		<ul>
    			<li><h1><a href="http://localhost/wordpress">AID INDIA</a></h1></li>			
    
    			<li><h4>Injustice anywhere is a threat to justice everywhere</h4></li>
    
    			<li><h4>Treat others as you would like to be treated</h4></li>
    
    		</ul>	
    
    	</div>
    
    <!-- Multi-level Navigational Plugin by PixoPoint Web Development ... http://pixopoint.com/multi-level-navigation/ -->
    
    <div id="pixopoint_menu_wrapper1">
    	<div id="pixopoint_menu1">
    		<ul class="sf-menu" id="suckerfishnav"><li><a href="http://localhost/wordpress/">Home</a></li><li class="page_item page-item-10 haschildren"><a href="http://localhost/wordpress/about/" title="Who we are">Who we are</a>
    <ul>
    	<li class="page_item page-item-62"><a href="http://localhost/wordpress/about/who-we-are/" title="About us">About us</a></li>
    
    	<li class="page_item page-item-64"><a href="http://localhost/wordpress/about/where-we-work/" title="Where we work">Where we work</a></li>
    	<li class="page_item page-item-66"><a href="http://localhost/wordpress/about/vision-mission/" title="Vision &amp; mission">Vision & mission</a></li>
    	<li class="page_item page-item-68"><a href="http://localhost/wordpress/about/organisation-profile/" title="Organisation profile">Organisation profile</a></li>
    </ul>
    </li>
    <li class="page_item page-item-5"><a href="http://localhost/wordpress/humanism/" title="What we do">What we do</a></li>
    <li class="page_item page-item-12 current_page_item"><a href="http://localhost/wordpress/the-community/" title="Where we work">Where we work</a>
    
    <ul>
    	<li class="page_item page-item-20"><a href="http://localhost/wordpress/the-community/geographical-conditions/" title="Geographical Conditions">Geographical Conditions</a></li>
    	<li class="page_item page-item-22"><a href="http://localhost/wordpress/the-community/population/" title="Population">Population</a></li>
    	<li class="page_item page-item-24"><a href="http://localhost/wordpress/the-community/literacy-level/" title="Literacy Level">Literacy Level</a></li>
    	<li class="page_item page-item-26"><a href="http://localhost/wordpress/the-community/health-status/" title="Health Status">Health Status</a></li>
    	<li class="page_item page-item-28"><a href="http://localhost/wordpress/the-community/beneficiaries/" title="Beneficiaries">Beneficiaries</a></li>
    	<li class="page_item page-item-30"><a href="http://localhost/wordpress/the-community/local-infrastructure/" title="Local Infrastructure">Local Infrastructure</a></li>
    
    </ul>
    </li>
    <li class="page_item page-item-131"><a href="http://localhost/wordpress/how-you-can-help/" title="How you can help">How you can help</a>
    <ul>
    	<li class="page_item page-item-138"><a href="http://localhost/wordpress/how-you-can-help/micro-credit-program/" title="Micro Credit Program">Micro Credit Program</a></li>
    	<li class="page_item page-item-140"><a href="http://localhost/wordpress/how-you-can-help/people-with-disabilities/" title="People with disabilities">People with disabilities</a></li>
    	<li class="page_item page-item-136"><a href="http://localhost/wordpress/how-you-can-help/teaching-computer-application/" title="Teaching Computer Application">Teaching Computer Application</a></li>
    	<li class="page_item page-item-134"><a href="http://localhost/wordpress/how-you-can-help/teaching-english/" title="Teaching English">Teaching English</a></li>
    
    </ul>
    </li>
    <li><a href="">News</a><ul><li><a href="http://localhost/wordpress/2009/01/need-based-training/">Need Based Training to the SHG Members</a></li><li><a href="http://localhost/wordpress/2009/01/children%e2%80%99s-day-celebration-in-island-of-hope/">Children’s Day Celebration in Island of Hope</a></li><li><a href="http://localhost/wordpress/2008/12/unity-in-humanist-orphanage-virudhunagar/">Unity In Humanist Orphanage Virudhunagar</a></li><li><a href="http://localhost/wordpress/2007/11/charity-in-virudhunagar/">Charity in Virudhunagar</a></li></ul></ul>
    	</div>
    </div>
    
    <!-- begin sidebar -->
    
    <div class="sidebar">
    
    	<ul>
    				<li id="recent-posts" class="widget widget_recent_entries">			<h2 class="widgettitle">Recent news</h2>
    			<ul>
    						<li><a href="http://localhost/wordpress/2009/01/need-based-training/">Need Based Training to the SHG Members </a></li>
    						<li><a href="http://localhost/wordpress/2009/01/children%e2%80%99s-day-celebration-in-island-of-hope/">Children’s Day Celebration in Island of Hope </a></li>
    						<li><a href="http://localhost/wordpress/2008/12/unity-in-humanist-orphanage-virudhunagar/">Unity In Humanist Orphanage Virudhunagar </a></li>
    
    						<li><a href="http://localhost/wordpress/2007/11/charity-in-virudhunagar/">Charity in Virudhunagar </a></li>
    						</ul>
    		</li>
    	</ul>
    
    </div>
    
    <!-- end sidebar -->
    
    	<div id="container">
    
    			<div class="post">			
    
    				<h2>Where we work</h2>
    
    				<div class="entry">	
    
    					<a class="post-edit-link" href="http://localhost/wordpress/wp-admin/page.php?action=edit&amp;post=12" title="Edit post">Edit</a>
    
    				</div>
    
    			</div>
    
    			</div>
    
    	<div class="sidebar2">
    	<ul>
    		<li id="search" class="widget widget_search"><div id="search"> 
    
        <form id="searchform" method="get" action="/index.php">
    
    	<div>
             	<input id="input" type="text" name="s" id="s" size="15" />
             	<input class="button" type="submit" value="Go" />
    
         	</div>
    
         </form>
    
    </div>
    </li>
    
    	</ul>
    </div>
    </div>
    
    </body>
    </html>
  4. mccormicky
    Member
    Posted 6 years ago #

    Could be the spaces in the name of the directory AID INDIA.
    It isn't a good idea to have spaces in the name of any file or folder. Best to name it aid_india,aid-india or aidindia.

    Secondly, you are calling other JS libraries such as mootools before the nifty.js and this can be causing the problem. Try removing the mootools.js, see if your search box rounds.

    Did you know you shouldn't use an id 2x in one document? nifty.js may not be able to even find the element because you have 2 named the same: li#search and div#search
    --a big no no.

    It matters what order you call different JS libraries and some simply will not work together.

    troubleshoot by renaming the elements to be rounded a different id name.
    cut the other js
    call the script src right above the function
    take the spaces out of your directory.
    good luck.

  5. citronboll
    Member
    Posted 6 years ago #

    Has this been solved?
    I experience the same kind of problems with my theme.
    I load the script, write some code, and nothing happens.

  6. edwinkort
    Member
    Posted 5 years ago #

    I just now noticed the niftyCorners.css 'problem' on my site, but.. I really don't know where it comes from, or how long it has been there. Can someone tell me if it could come from a plugin

  7. nemci7v
    Member
    Posted 5 years ago #

    Sort of a late response but for anyone else experiencing the problem,

    copy the niftycorners css to your themes css file

Topic Closed

This topic has been closed to new replies.

About this Topic