Viewing 15 replies - 1 through 15 (of 16 total)
  • The title is already linked, and points back to the website. Do you want it to go somewhere else?

    Thread Starter chiragvora

    (@chiragvora)

    I have used two buttons in the website with black color box.. the anchor feature sin’t working there.

    Well, the reason is because the button in the header is using JavaScript to scroll to the appropriate part of the page. If you want the same functionality from the two buttons you created, you’ll have to do one of two things:

    1). Take the Javascript that is making the first button work, and modify it so that the styles on your two buttons trigger the JavaScript function that scrolls to the appropriate portion of the page.

    2). Add id=”graph” to two elements on the page so that your two buttons have something to point at. The two elements you’ll want to target are the following:

    <h1>Survey</h1>

    needs to be changed into:

    <h1 id=”survey>Survey</h1>

    Then, further on down the page:

    <h1>CCI Graph</h1>

    needs to be changed into:

    <h1 id="graph">CCI Graph</h1>

    These changes can be made in whatever template file is being used to display your posts. I would check index.php, page.php, single.php, and whatever special templates you might have connected to that particular page.

    Thread Starter chiragvora

    (@chiragvora)

    Currently, as soon as I Select those buttons the frop down are not reaching to the title exactly. its coming down

    Thread Starter chiragvora

    (@chiragvora)

    Can you tell me how to do method 1?

    Maybe, I’d have to look at the JavaScript for a while

    Thread Starter chiragvora

    (@chiragvora)

    You want access to my website or u can see the code through Firebug on Mozilla ?

    Well, I can’t figure out how to penetrate the Javascript. May I ask you what’s wrong with using the buttons the theme has embedded in the header bar?

    Thread Starter chiragvora

    (@chiragvora)

    If I double click them (I am talking about those present under menu section) then only it comes to exact position. In single click it doesn’t work correctly.

    I see…

    Well, here’s the thing. If you add the proper id tags to the proper elements, your two buttons work fine. The reason they’re not displaying properly is because the header is fixed to the top of the screen and covers it up.

    This is being caused by that same Javascript function. So, it would seem that the best solution is to remove the javascript file, and all connections to it from your site. Then simply make the anchor tags and links yourself.

    Thread Starter chiragvora

    (@chiragvora)

    <?php
    /**
     * The header for home page.
     *
     */
    ?>
    <!DOCTYPE html>
    <html <?php language_attributes(); ?>>
    <head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta charset="<?php bloginfo( 'charset' ); ?>" />
    <title><?php wp_title('', true, 'right'); ?></title>
    <?php wp_head(); ?>
    </head>
    <body <?php body_class(); ?>>
    <?php if(is_home()){$wrap_class = "home-site";}else{$wrap_class = "site";}?>
    <div class="<?php echo $wrap_class;?>">
    	<header class="home-header">
    		<div class="home-logo onetone-logo">
            	<a href="<?php echo esc_url(home_url('/')); ?>">
            <?php if ( onetone_options_array('logo')!="") { ?>
            <img src="<?php echo onetone_options_array('logo'); ?>" alt="<?php bloginfo('name'); ?>" />
            <?php }else{ ?>
            <span class="site-name">
            <?php bloginfo('name'); ?>
            </span>
            <?php }?>
            </a>
            <div class="site-description"><?php bloginfo('description'); ?></div>
            </div>
    
            <a class="home-navbar navbar" href="javascript:;"></a>
            <nav class="home-navigation top-nav">
    <?php
     $onepage_menu = '';
     $section_num = onetone_options_array( 'section_num' );
     if(isset($section_num) && is_numeric($section_num ) && $section_num >0):
     for( $i = 0; $i < $section_num ;$i++){
    
     $section_menu = onetone_options_array( 'menu_title_'.$i );
     $section_slug = onetone_options_array( 'menu_slug_'.$i );
    
     if(isset($section_menu) && $section_menu !=""){
     $sanitize_title = sanitize_title($section_menu);
     $section_menu = onetone_options_array( 'menu_title_'.$i );
     if(trim($section_slug) !=""){
    	 $sanitize_title = $section_slug;
    	 }
     $onepage_menu .= '<li id="onetone-'.$sanitize_title.'" class="onetone-menuitem"><a href="#'.$sanitize_title.'" >
     <span>'.$section_menu.'</span></a></li>';
     }
     }
    endif;
    if ( has_nav_menu( "home_menu" ) ) {
     wp_nav_menu(array('theme_location'=>'home_menu','depth'=>0,'fallback_cb' =>false,'container'=>'','container_class'=>'main-menu','menu_id'=>'menu-main','menu_class'=>'main-nav','link_before' => '<span>', 'link_after' => '</span>','items_wrap'=> '<ul id="%1$s" class="%2$s">'.$onepage_menu.'%3$s</ul>'));
    }
    else{
    echo '<ul>'.$onepage_menu.'</ul>';
    }
    ?>
            </nav>
    		<div class="clear"></div>
    	</header>
    	<!--header-->

    Here is my header code. If I remove the java script then what to replace with?

    I’m having a lot of difficulty making it work. Near as I can tell, the file you want to change is under themes/onetone->js->jquery.smint.js. The changes I have made might work, and they might be comprehensive enough to make your current design work, but I can’t say for certain:

    /*
    
    SMINT V1.0 by Robert McCracken
    SMINT V2.0 by robert McCracken with some awesome help from Ryan Clarke (@clarkieryan) and mcpacosy ‏(@mcpacosy)
    
    SMINT is my first dabble into jQuery plugins!
    
    http://www.outyear.co.uk/smint/
    
    If you like Smint, or have suggestions on how it could be improved, send me a tweet @rabmyself
    
    */
    
    (function($) {
    
    	$.fn.smint = function( options ) {
    
    		// adding a class to users div
    		$(this).addClass('smint')
    
    		var settings = $.extend({
    		            'scrollSpeed '  : 300
    		}, options);
    
    		//Set the variables needed
    		var optionLocs = new Array();
    		var lastScrollTop = 0;
    		var menuHeight = $(".smint").height();
    
    		return $('.smint li.onetone-menuitem').each( function(index) {
    
    			if ( settings.scrollSpeed ) {
    				var scrollSpeed = settings.scrollSpeed
    			}
    
    			//Fill the menu
    			var id = $(this).attr("id");
    			optionLocs.push(Array($("section."+id).position().top-menuHeight, $("section."+id).height()+$("section."+id).position().top, id));
    
    			///////////////////////////////////
    
    			// get initial top offset for the menu
    			var stickyTop = $('.smint').offset().top;	
    
    			// check position and make sticky if needed
    			var stickyMenu = function(direction){
    
    				// current distance top
    				var scrollTop = $(window).scrollTop(); 
    
    				// if we scroll more than the navigation, change its position to fixed and add class 'fxd', otherwise change it back to absolute and remove the class
    				if (scrollTop > stickyTop) {
    					$('.smint').parents(".home-header").css({ 'position': 'relative' }).addClass('fxd');
    				} else {
    					$('.smint').parents(".home-header").css({ 'position': 'relative'}).removeClass('fxd');
    				}
                   if(stickyTop>$('.smint').height()){
    				   $('.smint').parents(".home-header").css({ 'position': 'relative' }).addClass('fxd');
    				   }
    				//Check if the position is inside then change the menu
    				// Courtesy of Ryan Clarke (@clarkieryan)
    
    				if(optionLocs[index][0] <= scrollTop+90 && scrollTop <= optionLocs[index][1]){
    				$('.smint li.onetone-menuitem').removeClass("active");
    					if(direction == "up"){
    						$("#"+id).addClass("active");
    						if(typeof optionLocs[index+1] !== "undefined"){
    						$("#"+optionLocs[index+1][2]).removeClass("active");
    						}
    					} else if(index > 0) {
    						$("#"+id).addClass("active");
    						if(typeof optionLocs[index-1] !== "undefined"){
    						$("#"+optionLocs[index-1][2]).removeClass("active");
    						}
    					} else if(direction == undefined){
    						$("#"+id).addClass("active");
    					}
    					/*$.each(optionLocs, function(i){
    						if(id != optionLocs[i][2]){
    							console.log(i);
    							$("#"+optionLocs[i][2]).removeClass("active");
    						}
    					});*/
    				}
    			};
    
    			// run functions
    			stickyMenu();
    
    			// run function every time you scroll
    			$(window).scroll(function() {
    				//Get the direction of scroll
    				var st = $(this).scrollTop();
    				if (st > lastScrollTop) {
    				    direction = "down";
    				} else if (st < lastScrollTop ){
    				    direction = "up";
    				}
    				lastScrollTop = st;
    				if(typeof direction !== "undefined"){
    				stickyMenu(direction);
    				}
    
    				// current distance top
    				var scrollTop = $(window).scrollTop(); 
    
    				// if we scroll more than the navigation, change its position to fixed and add class 'fxd', otherwise change it back to absolute and remove the class
    
    				// Check if at bottom of page, if so, add class to last <a> as sometimes the last div
    				// isnt long enough to scroll to the top of the page and trigger the active state.
    
    				if($(window).scrollTop() + $(window).height() == $(document).height()) {
           			$('.smint > li').removeClass('active')
           			//$('.smint > li').last().addClass('active')
       }
    			});
    
    			///////////////////////////////////////
    
            	$(this).on('click', function(e){
    
    				// gets the height of the users div. This is used for off-setting the scroll so the menu doesnt overlap any content in the div they jst scrolled to
    				var selectorHeight = $('.smint').height();   
    
            		// stops empty hrefs making the page jump when clicked
    				e.preventDefault();
    
    				// get id pf the button you just clicked
    		 		var id = $(this).attr('id');
    
    		 		// if the link has the smint-disable class it will be ignored
    		 		// Courtesy of mcpacosy ‏(@mcpacosy)
    
                    if ($(this).hasClass("smint-disable"))
                    {
                        return false;
                    }
    				$('.smint li.onetone-menuitem').removeClass("active");
    
    				// gets the distance from top of the div class that matches your button id minus the height of the nav menu. This means the nav wont initially overlap the content.
    				if(typeof $('section.'+ id) !== "undefined"){
    				var goTo =  $('section.'+ id).offset().top -selectorHeight;
    
    				// Scroll the page to the desired position!
    				$("html, body").animate({ scrollTop: goTo }, scrollSpeed);
    							}
    
    			});
    			     	$(".scroll").on('click', function(e){
    
    				// gets the height of the users div. This is used for off-setting the scroll so the menu doesnt overlap any content in the div they jst scrolled to
    				var selectorHeight = $('.smint').height()+80;   
    
            		// stops empty hrefs making the page jump when clicked
    				e.preventDefault();
    
    				// get id pf the button you just clicked
    		 		var id = $(this).data('section');
    
    		 		// if the link has the smint-disable class it will be ignored
    		 		// Courtesy of mcpacosy ‏(@mcpacosy)
    
                    if ($(this).hasClass("smint-disable"))
                    {
                        return false;
                    }
    				$('.smint li.onetone-menuitem').removeClass("active");
    
    				// gets the distance from top of the div class that matches your button id minus the height of the nav menu. This means the nav wont initially overlap the content.
    				if(typeof $('section.onetone-'+ id) !== "undefined"){
    				var goTo =  $('section.onetone-'+id).offset().top -selectorHeight;
    
    				// Scroll the page to the desired position!
    				$("html, body").animate({ scrollTop: goTo }, 100);
    				}
    
    			});	
    
    		});
    	}
    
    })(jQuery);
    
    	/////
    jQuery(document).ready( function() {
        jQuery('.home-navigation ul').smint({
        	'scrollSpeed' : 1000
        });
    });

    Do not edit the theme itself. First create a child theme for your changes. Then try posting in http://wordpress.org/support/theme/onetone/

    Thread Starter chiragvora

    (@chiragvora)

    How to do that? I have installed Custom CSS Plugin

    Thread Starter chiragvora

    (@chiragvora)

    Atleast someone help me to add same effects on the blacks buttons used as that of menu. I am posting the code of header-site.php

    <?php
    /**
     * The header for site page.
     *
     */
    ?>
    <!DOCTYPE html>
    <html <?php language_attributes(); ?>>
    <head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta charset="<?php bloginfo( 'charset' ); ?>" />
    <title><?php wp_title('', true, 'right'); ?></title>
    <?php wp_head(); ?>
    </head>
    <body <?php body_class(); ?>>
    <div class="site">
    	<header class="site-header">
    		<div class="site-logo onetone-logo">
    
    			<?php if(onetone_options_array('logo')){?>
    			<a href="<?php echo esc_url(home_url('/')); ?>"><img src="<?php echo onetone_options_array('logo'); ?>" alt="<?php bloginfo('name'); ?>" /></a>
    			<?php }else{?>
                <a href="<?php echo esc_url(home_url('/')); ?>"><h1><span class="site-name"><?php bloginfo('name'); ?></span></h1></a>
                <?php }?>
                <div class="site-description"><?php bloginfo('description'); ?></div>
    		</div>
            <a class="site-navbar navbar" href="javascript:;"></a>
    		<nav class="site-navigation top-nav">
    			<div class="nav-menu">
    			<?php wp_nav_menu(array('theme_location'=>'primary','depth'=>0,'fallback_cb' =>false,'container'=>'','container_class'=>'main-menu','menu_id'=>'menu-main','menu_class'=>'main-nav','link_before' => '<span>', 'link_after' => '</span>'));?>
    			</div>
    		</nav>
    	</header>

    The problem is that support is literally dead and so is the official website support.

Viewing 15 replies - 1 through 15 (of 16 total)
  • The topic ‘How to add anchor tags in title’ is closed to new replies.