I am using the plugin qTranslate 2.5.39 and wordpress 3.8.1.
I want to have a drop down with the flags in the header and as the FAQ points, here is my header.php code:
<div id="navbar" class="navbar">
<nav id="site-navigation" class="navigation main-navigation" role="navigation">
<h3 class="menu-toggle"><?php _e( 'Menu', 'twentythirteen' ); ?></h3>
<a class="screen-reader-text skip-link" href="#content" title="<?php esc_attr_e( 'Skip to content', 'twentythirteen' ); ?>"><?php _e( 'Skip to content', 'twentythirteen' ); ?></a>
<?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'nav-menu' ) ); ?>
<!--<?php get_search_form(); ?>-->
<?php qtrans_generateLanguageSelectCode('image'); ?>
</nav><!-- #site-navigation -->
</div><!-- #navbar -->
And in my styles.css
.qtrans_language_chooser { list-style-type:none; background-color: red }
.qtrans_language_chooser li { float:left; margin-right:3px }
.qtrans_flag { border:1px solid #b6b6b6 }
I tried as well with !important, but didnt work.
The source code:
<ul class="qtrans_language_chooser" id="qtranslate-chooser">
<li class="lang-de">
<a href="http://link/?lang=de" hreflang="de" title="Deutsch" class="qtrans_flag qtrans_flag_de">
<span style="display:none">Deutsch</span>
</a>
</li>
<li class="lang-en">
<a href="http://myfavcolorismusi.byethost32.com/immtranslates/?lang=en" hreflang="en" title="English" class="qtrans_flag qtrans_flag_en">
<span style="display:none">English</span>
</a>
</li>
<li class="lang-es active">ç
<a href="http://myfavcolorismusi.byethost32.com/immtranslates/" hreflang="es" title="Español" class="qtrans_flag qtrans_flag_es">
<span style="display:none">Español</span>
</a>
</li>
</ul><div class="qtrans_widget_end"></div>
Any ideas? Thanks
EDIT
Could it be a google chrome style managment problem?
in css file of your theme, try
#qtranslate-chooser{//style}
#qtranslate-chooser li{//style}
...
Related
I am new in Wordpress so I hope I will be very explicit in the following description. Right now I`m trying to create something like https://getbootstrap.com/docs/5.1/components/navs-tabs/ but in Wordpress using bootstrap 5. In the tabs title I want to show the title of the post and in the tab content will be the_content().Thanks in advance !
The ul needs to be outside of the while loop so that you only have a single navigation component. Right now it is creating a separate navigation for every oracion. Try the following:
<div class="col-md-9">
<?php
$wpb_all_query = new WP_Query(array(
'post_type' => 'post',
'category_name' => 'orar',
'post_status' => 'publish',
)); ?>
<?php if ($wpb_all_query->have_posts()) : ?>
<ul class="nav nav-pills mb-3" id="pills-tab" role="tablist">
<?php while ($wpb_all_query->have_posts()) :
$wpb_all_query->the_post(); ?>
<li class="nav-item" role="presentation">
<button class="nav-link" id="pills-profile-tab" data-bs-toggle="pill" data-bs-target="#pills-profile" type="button" role="tab" aria-controls="pills-profile" aria-selected="false"><?php $wpb_all_query->the_title(); ?></button>
</li>
<div class="tab-content" id="pills-tabContent">
<div class="tab-pane fade" id="pills-profile" role="tabpanel" aria-labelledby="pills-profile-tab"><?php $wpb_all_query->the_content(); ?></div>
</div>
<?php endwhile; ?>
</ul>
<?php wp_reset_postdata(); ?>
<?php
else : ?>
<p><?php ('Sorry, no posts matched your criteria.'); ?></p>
<?php
endif; ?>
</div>
WordPress custom slider not running after loading the browser. I think the active class not working for every item but I can not fix it up. Please review the codes and help me---
Here is the JavaScript coding
jQuery(function($) {'use strict',
//#main-slider
$(window).load(function(){
$('#main-slider.carousel').carousel({
interval: 1000
});
});
});
Please review the custom post loop of the post. Here is the full site templates--
https://www.dropbox.com/s/fmqbjb9hahliwf6/mysite.zip?dl=0
<section id="main-slider" class="no-margin">
<div class="carousel slide">
<ol class="carousel-indicators">
<li data-target="#main-slider" data-slide-to="0" class="active"></li>
<li data-target="#main-slider" data-slide-to="1"></li>
<li data-target="#main-slider" data-slide-to="2"></li>
</ol>
<div class="carousel-inner">
<?php
global $post;
$c = 0;
$args = array( 'post_type' => 'slide',
'posts_per_page' => 5 );
$myposts = get_posts( $args );
foreach( $myposts as $post ) : setup_postdata($post);
$class = ''; $c++;
$slide_bg = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), 'slide-bg');?>
<?php if ( $c == 1 ) $class = ' active';
else $active = ''; ?>
<div class="item <?php echo $class; ?>" style="background-image: url(<?php echo $slide_bg[0];?>)">
<div class="container">
<div class="row slide-margin">
<div class="col-sm-6">
<div class="carousel-content">
<h1 class="animation animated-item-1"><?php the_title(); ?></h1>
<h2 class="animation animated-item-2"><?php the_content();?></h2>
<a class="btn-slide animation animated-item-3" href="#">Read More</a>
</div>
</div>
</div>
</div>
</div><!--/.item-->
<?php endforeach; wp_reset_postdata(); ?>
</div><!--/.carousel-inner-->
</div><!--/.carousel-->
<a class="prev hidden-xs" href="#main-slider" data-slide="prev">
<i class="fa fa-chevron-left"></i>
</a>
<a class="next hidden-xs" href="#main-slider" data-slide="next">
<i class="fa fa-chevron-right"></i>
</a>
</section><!--/#main-slider-->
Are you sure that you properly select the slider?
Because
$('#main-slider.carousel') means "give me slider with id=main-slider and class=carousel, but in your case as far as I can see from provided code must be
$('#main-slider .carousel').carousel({});
For my WordPress theme I need help from an expert. Here is my nav-list html
Example:
//Here is my WP code:
<li>
<?php
$category_men = get_the_category_by_id($catmen['content-cat-one']);
$content_one =new WP_Query(array(
'post_type' => 'post',
'posts_per_page' => 1,
'category_name' => $category_men
));
while($content_one->have_posts()) : $content_one->the_post(); ?>
<a href="<?php echo get_category_link( $catmen['content-cat-one'] ); ?>#<?php echo get_cat_ID($category_men); ?>" >Men Category</a>
<?php endwhile; ?>
</li>
<ul class="nav nav-tabs">
<li>Men Category</li>
</ul>
<div class="tab-pane active" id="men">
</div>
<div class="tab-pane active" id="<?php echo get_cat_ID($category_men); ?>">
The result comes out: //localhost/my-themes/category/featured/#5
I do not want the result above, I want //localhost/my-themes/category/featured/
How to overcome these problems?
Replace this code,
<a href="<?php echo get_category_link( $catmen['content-cat-one'] ); ?>#<?php echo get_cat_ID($category_men); ?>" >Men Category</a>
with the code snippet bellow.
Men Category
I have an online store developed in Wordpress/WooCommerce and I need to add some flags, in top navigation.
In header.php I saw that that section is called by woo_top() function, but I don't find it.
Please help me to find this function or how to add some code in top navigation.
// Hook In
add_action( 'woo_top', 'woo_bootstrapped_nav' );
// Our hooked in Function
function woo_bootstrapped_nav() { ?>
<div class="navbar navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<?php bloginfo( 'name' ); ?>
<?php
$args = array(
'theme_location' => 'top-bar',
'depth' => 2,
'container' => 'div',
'container_class' => 'nav-collapse collapse pull-left',
'menu_class' => 'nav',
'walker' => new Bootstrap_Walker_Nav_Menu()
);
wp_nav_menu($args);
?>
<ul class="nav secondary-nav pull-right">
<li class="dropdown"> <?php echo do_shortcode('[fblike style="button_count" width="90" float="left"][google_plusone size="medium" float="left" annotation="bubble"][twitter_follow username="twitter_name" show_screen_name="false" count="false" float="left"]'); ?></li>
</ul>
</div>
</div>
</div>
<?php } // End woo_bootstrapped_nav()
here in above code add flag images below home url link.
I can't figure out how to get a DIV to show up over a DIV that's underneath it. In other words, my webpage has a head, with a DIV that floats left and a DIV that floats right. Underneath that is a menu bar. I don't have many menu items, so I want image in the DIV that floats right to partially overlap the menu bar. I'm able to make it work with absolute positioning... but that not ideal. I went ahead and changed the width of the menu bar, but that's more of a temporary fix to get what I want. Thoughts?
www.sacspartans.org
<div id="page" class="hfeed site">
<header id="masthead" class="site-header" role="banner">
<div id="header-left">
<hgroup>
<h1 class="site-title">
<a href="<?php echo esc_url( home_url( '/' ) ); ?>">
<img src="http://sacspartans.org/wp-
content/uploads/2013/05/banner.png" alt="SacSpartans"
title="SacSpartans" border="0" />
</a>
</h1>
<h2 class="site-description"><?php bloginfo( 'description' ); ?>
</h2>
</hgroup>
</div>
<div id="header-right">
<img src="http://sacspartans.org/wp-
content/uploads/2013/05/california1.png" alt="MSU Alumni Club of
the Sacramento Valley" title="MSU Alumni Club of the Sacramento
Valley" border="0" />
</div>
<div id="navigation-bar">
<nav id="site-navigation" class="main-navigation" role="navigation">
<h3 class="menu-toggle"><?php _e( 'Menu', 'twentytwelve' ); ?></h3>
<a class="assistive-text" href="#content" title="<?php esc_attr_e(
'Skip to content', 'twentytwelve' ); ?>"><?php _e( 'Skip to
content', 'twentytwelve' ); ?></a>
<?php wp_nav_menu( array( 'theme_location' => 'primary',
'menu_class' => 'nav-menu' ) ); ?>
</nav>
</div>
And now CSS info.
/* Header */
#header-left {
float: left;
}
#header-right {
float: right;
margin-top: 0;
}
#navigation-bar {
width: 575px;
}