No search results were found in Documentation!
Not sure why the mega menu doesnt work on the mobile version of the theme. http://www.fastpitchelite.com/blog It works ok on the desktop version but not the mobile. Does anyone have any suggestions
Thanks in advance
Actually, the toggle is fine for SEO purposes as Bootstrap uses this, as do many WordPress sites including WP VIP sites; so not a huge hairy deal since they fall under a “menu” class. We’ve had no SEO problems with that on our sites.
Just an opinion.
Arguably adding “rel=nofollow” to the mobile menu might be good solution if that was your concern.
BTW: if you use Google’s “fetch as Google” you will see “what the spider sees” — where they look at the rendered page, and are not stressing about informal code not rendered on page.
Today i did simulate my website http://www.wpdiv.com with http://www.mobilephoneemulator.com/
Sometimes there is no issues but very frequently CSS not loading properly and menu got broken as illustrated in below screenshot.
http://oi60.tinypic.com/m096c.jpg
How can i resolve the same?
Expecting your kind co-operation
With regards
Selvam.S
Note : When you testing website via http://www.mobilephoneemulator.com/ don’t forget to navigate the website with simulator itself to regenerate the issue.
Hi
I’m using Header Style 3 (full width logo + menu)for my homepage and uploaded a 3000×300 logo image. (I want a bigger logo than 300×100)
I’ve also used 3000×300 for mobile logo too, but the display seems too small on the top right corner. Can I make the mobile logo bigger across the header? The website is http://www.konenok.com
Do I have to make changes to css? If so, which files do I need to edit? Or where can I add the code? (I’m using a child theme)
Thank you for your help
Ken
Hi…
I activated the “Smart snap – (mobile)” but it was working like i have activated the “Smart snap – (always)”.
What could be the reason behind it?
Thanks!
Hi again!
I was trying to do a little customization with the logo. I tried adding the full-width logo+menu and combine it with a separate logo for the mobile. Strangely, the mobile logo never appeared, so the full width desktop logo just shortens and appears in the mobile view. I found a solution of my own. instead of using a full width logo, I am now using the default logo+ad+menu and I have added a background image to the css element(.td-boxed-layout .td-logo-rec-wrap).
I was wondering if you could see to this yourself too? maybe make it possible for me to add a separate logo for the mobile? There probably might be something wrong with the mobile-logo.php, but I am really an html guy, not much big on php, you know. So, could you pleaze see?
Hi,
Unfortunately there no such an option for mobile’s menu. This is on our todo list and will be added on futures updates, as we have over 200 features on our list and we have to take them in the order of priority.
Thanks!
Hello, the website that use this template, the menu has many sections and sub-sections, then cell without collapsing the menu appears, which is a problem, I want users to view the main sections first and on click to show sub-sections. I want to know how to do it so that the menu of the mobile charge collapsed? Thanks
<!– Style compiled by theme –>
<style>
.td-menu-header .td-sp,
.sf-sub-indicator{
background-image: url(‘http://cdn.rnbjunk.com/wp-content/themes/Newspaper/images/header/elements-menu.png’);
}
@media only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (-moz-min-device-pixel-ratio: 2),
only screen and (min-device-pixel-ratio: 2) {
.td-menu-header .td-sp, .sf-sub-indicator{
background-image: url(‘http://cdn.rnbjunk.com/wp-content/themes/Newspaper/images/header/elements-menu@2x.png’);
}
}
</style>
<!– JS generated by theme –>
<script>
var td_blocks = []; //here we store all the items for the current page
//td_block class – each ajax block uses a object of this class for requests
function td_block() {
this.id = ”;
this.block_type = 1; //block type id (1-234 etc)
this.atts = ”;
this.td_cur_cat = ”;
this.td_column_number = ”;
this.td_current_page = 1; //
this.post_count = 0; //from wp
this.found_posts = 0; //from wp
this.max_num_pages = 0; //from wp
this.is_ajax_running = false;
this.header_color = ”;
this.ajax_pagination_infinite_stop = ”; //show load more at page x
}
var td_ad_background_click_link=””;
var td_ad_background_click_target=””;
var td_ajax_url=”http://www.rnbjunk.com/wp-admin/admin-ajax.php”;
var td_get_template_directory_uri=”http://www.rnbjunk.com/wp-content/themes/Newspaper”;
var tds_snap_menu=”snap”;
var tds_header_style=””;
var tds_mobile_swipe=””;
var td_search_url=”http://www.rnbjunk.com/search/”;
var td_please_wait=”Please wait…”;
var td_email_user_pass_incorrect=”User or password incorrect!”;
var td_email_user_incorrect=”Email or username incorrect!”;
var td_email_incorrect=”Email incorrect!”;
var tds_more_articles_on_post_enable=””;
var tds_more_articles_on_post_time_to_wait=””;
var tds_more_articles_on_post_pages_distance_from_top=”0″;
var tds_theme_color_site_wide=”#4db2ec”;
</script>
<script type=”text/javascript”>
/* <![CDATA[ */
var wpNotesIsJetpackClient = true;
/* ]]> */
</script>
</head>
<body class=”home page page-id-41827 page-template page-template-page-homepage-loop page-template-page-homepage-loop-php logged-in admin-bar no-customize-support td-full-layout wpb-js-composer js-comp-ver-4.4.2 vc_responsive”>
Now It’s better. but the color is blu. My question is, can i change colors in a easier way bypassing that panel?
Hi,
Please use this custom css: http://screencast.com/t/GXij7S2xijYf – http://screencast.com/t/9iaB9bp4 – http://screencast.com/t/F5P26hYkx7H
.td-header-main-menu.td-affix {
top: 60px;
}
.admin-bar .sbNavIframe {
top: 32px;
}
.admin-bar .td-header-main-menu.td-affix {
top: 92px;
}
@media screen and (max-width: 600px){
#wpadminbar {
position: fixed;
}
}
Also on mobile view: http://screencast.com/t/JnxB7M8u – http://screencast.com/t/O2oRyw0gOfxN
Maybe you will have to use !important
Thanks!
I’ve deleted from style.css, but still having code on the page:
<!– Style compiled by theme –>
<style>
.block-title a,
.block-title span,
.td-tags a:hover,
.td-scroll-up-visible,
.td-scroll-up,
.sf-menu ul .current-menu-item > a,
.sf-menu ul a:hover,
.sf-menu ul .sfHover > a,
.sf-menu ul .td-menu-item > a:hover,
.td-rating-bar-wrap div,
.iosSlider .slide-meta-cat,
.sf-menu ul .current-menu-ancestor > a,
.sf-menu ul .current-category-ancestor > a,
.td-404-sub-sub-title a,
.widget_tag_cloud .tagcloud a:hover,
.td-mobile-close a,
ul.td-category a,
.td_social .td_social_type .td_social_button a,
.dropcap,
.td-forum-category-title .td-forum-category-name,
.td_display_err,
.td_block_mega_menu .td-ajax-next-page:hover,
.td_block_mega_menu .td_ajax-prev-page:hover,
.post-via span,
.td_wrapper_video_playlist
.td_video_controls_playlist_wrapper
{
background-color: #6e61b0;
}
.block-title,
.sf-menu li a:hover,
.sf-menu .sfHover a,
.sf-menu .current-menu-ancestor a,
.sf-menu .current-category-ancestor a,
.header-search-wrap
.dropdown-menu,
.sf-menu > .current-menu-item > a,
.ui-tabs-nav,
.woocommerce .product .woocommerce-tabs ul.tabs,
.td-forum-list-head,
.td-login-panel-title
{
border-color: #6e61b0;
}
.widget_price_filter .ui-slider-handle,
.td_wrapper_video_playlist .td_video_currently_playing:after
{
border-color: #6e61b0 !important;
}
.author-box-wrap .td-author-name a,
blockquote p,
.page-nav a:hover,
.widget_pages .current_page_item a,
.widget_calendar td a,
.widget_categories .current-cat > a,
.widget_pages .current_page_parent > a,
.td_pull_quote p,
.page-nav-post a:hover span,
.td-forum-last-comment-content .td-forum-last-author,
.td-topics-title-details a,
.td-posted-in a
{
color: #6e61b0;
}
.woocommerce .button,
.woocommerce .form-submit #submit,
.widget_price_filter .ui-slider-handle,
.jetpack_subscription_widget input[type=”submit”],
.pp_woocommerce .pp_close,
.pp_woocommerce .pp_expand,
.pp_woocommerce .pp_contract,
.pp_woocommerce .pp_arrow_previous,
.pp_woocommerce .pp_arrow_next,
.pp_woocommerce
.pp_next:before,
.pp_woocommerce .pp_previous:before,
#bbpress-forums .button
{
background: #6e61b0 !important;
}
.woocommerce .woocommerce-message,
.woocommerce .woocommerce-info,
.bbp-template-notice,
.td-reply-list-header
{
border-color: #6e61b0 !important;
}
.woocommerce .woocommerce-message:before,
.woocommerce .woocommerce-info:before,
.td-login-button
{
background-color: #6e61b0 !important;
}
.buddypress #buddypress div.dir-search input[type=”submit”],
.buddypress #buddypress .message-search input[type=”submit”],
.buddypress #buddypress .item-list-tabs ul li.selected a,
.buddypress #buddypress .generic-button a,
.buddypress #buddypress .submit input[type=”submit”],
.buddypress #buddypress .ac-reply-content input[type=”submit”],
.buddypress #buddypress .standard-form input[type=”submit”],
.buddypress #buddypress .standard-form .button-nav .current a,
.buddypress #buddypress .standard-form .button,
.buddypress #buddypress input[type=”submit”],
.buddypress #buddypress a.accept,
.buddypress #buddypress #activate-page .standard-form input[type=”submit”],
.buddypress #buddypress .standard-form #group-create-body input[type=”button”],
.post-password-required input[type=”submit”]
{
background: #6e61b0 !important;
}
.buddypress #buddypress .groups .item-meta,
.bbp-forum-title:hover,
.td_login_tab_focus,
.block-mega-child-cats a.cur-sub-cat
{
color: #6e61b0 !important;
}
.page-nav .current,
.page-nav-post span
{
background-color: #6e61b0;
border-color: #6e61b0;
}
.wpb_btn-inverse,
.ui-tabs-nav .ui-tabs-active a,
.post .wpb_btn-danger,
.form-submit input,
.wpcf7-submit,
.wpb_default,
.woocommerce .product .woocommerce-tabs ul.tabs li.active,
.woocommerce.widget_product_search input[type=”submit”],
.more-link-wrap,
.td_read_more {
background-color: #6e61b0 !important;
}
.header-search-wrap .dropdown-menu:before {
border-color: transparent transparent #6e61b0;
}
.td-mobile-content .current-menu-item > a,
.td-mobile-content a:hover
{
color: #6e61b0 !important;
}
.category .entry-content,
.tag .entry-content,
.td_quote_box
{
border-color: #6e61b0;
}
.td-timeline-block-title {
background-color: #6e61b0 !important;
}
.td-timeline-wrapper-links {
border-color: #6e61b0 !important;
}
.td-timline-h1-link span {
background-color: #6e61b0 !important;
}
.td-page-title .td-search-query {
color: #6e61b0;
}
.td-sbig-title-wrap .td-sbig-title,
.td-slide-item-sec .td-sbig-title-wrap,
.td-big-grid-title .td-sbig-title-wrap
{
background-color: rgba(110, 97, 176, 0.7);
}
::-moz-selection {
background: #a093e2;
color: #fff;
}
::selection {
background: #a093e2;
color: #fff;
}
a, .widget_recent_comments .recentcomments .url {
color: #6e61b0;
}
.cur-sub-cat {
color:#6e61b0 !important;
}
.blog-stack .sf-menu .current-menu-item a,
.blog-stack .sf-menu .current-menu-parent .current-menu-item a,
.blog-stack .sf-menu .current-menu-parent > a,
.blog-stack .sf-menu > li:hover > a,
.blog-stack .sf-menu ul li:hover > a,
.blog-stack .td-post-text-content .more-link-wrap:hover a,
.blog-stack .sf-menu ul .td_mega_menu_sub_cats a.cur-sub-cat,
.blog-stack .sf-menu ul .td_mega_menu_sub_cats a.cur-sub-cat:hover,
.blog-stack .td-mega-menu .block-mega-child-cats a:hover,
.blog-stack .td_mod_mega_menu:hover .item-details a,
.blog-stack .sf-menu .current-menu-ancestor > a,
.blog-stack .sf-menu .current-category-ancestor > a
{
color:#6e61b0;
}
.blog-stack .sf-menu > .current-menu-ancestor > a,
.blog-stack .sf-menu > .current-category-ancestor > a
{
color:#6e61b0 !important;
}
.blog-stack .sf-menu ul li {
background-color: #6e61b0;
}
.blog-stack .td-post-text-content .more-link-wrap a:hover {
outline-color: #6e61b0;
}
a:hover,
.widget_recent_comments .recentcomments .url:hover
{
color: #ed4fef;
}
.td-menu-header .td-sp,
.sf-sub-indicator{
background-image: url(‘http://cdn.rnbjunk.com/wp-content/themes/Newspaper/images/header/elements-menu.png’);
}
@media only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (-moz-min-device-pixel-ratio: 2),
only screen and (min-device-pixel-ratio: 2) {
.td-menu-header .td-sp, .sf-sub-indicator{
background-image: url(‘http://cdn.rnbjunk.com/wp-content/themes/Newspaper/images/header/elements-menu@2x.png’);
}
}
</style>
Hi,
1. Try to change again span from menu-top.php but now like this and see how it goes: http://screencast.com/t/LWb0WDwz
This change will increase the width: http://screencast.com/t/kWHHVFiAFg
2. Please use this css code for logo in mobile view: http://screencast.com/t/Q01I58cibx7H
@media (max-width: 767px){
.header-style-3 .td-logo img {
position: absolute;
right: 0px;
top: auto;
}
}
Thanks!
Hi.
When I click on the menu logo on mobile all the header menu disappears and I can’t select anything like this image:
Do you know what could be the cause?
Thanks! Now, just to be picky, we can move a little the basket when the user logs in? http://screencast.com/t/Nyu6sQA5aRNd
Then, in the mobile version, as you can see here http://screencast.com/t/JNh3ehhcWPm7 we can move the logo that limits the view on the menu?
Hi,
That is happens because the code is included in @media for mobile. If you want to change category title for all views just put the } above:
@media (max-width: 767px) {
#td-top-menu .sf-menu {
display: none !important;
}
.blog-stack #td-top-search{
right: -50px;
top: -75px;
}
.header-search-wrap .dropdown-menu {
left: -56px!important;
}
.header-style-3 .td-logo img {
width: 30px;
}
}
.category .td-page-title span {
font-size: 20px !important;
font-family: Vollkorn !important;
}
Thanks!
I followed your instructions exactly as you told me to do and it’s not working for me.
To be honest I don’t like this customization I think there are lots of modifications which are unnecessary. I just want to place my ad below the menu instead of above the menu on mobile view only, it should not be that complicated.
Also if you will look at your screenshot, on mobile view you have a huge space between the ad and the content and the ad is not 100% width.
Hi Emil, when i load source of my site, i see a lot of codes coming from newspaper theme that actually i don’t use, and that are heaving codes on every page: view-source:http://www.rnbjunk.com/
<!– Style compiled by theme –>
<style>
.block-title a,
.block-title span,
.td-tags a:hover,
.td-scroll-up-visible,
.td-scroll-up,
.sf-menu ul .current-menu-item > a,
.sf-menu ul a:hover,
.sf-menu ul .sfHover > a,
.sf-menu ul .td-menu-item > a:hover,
.td-rating-bar-wrap div,
.iosSlider .slide-meta-cat,
.sf-menu ul .current-menu-ancestor > a,
.sf-menu ul .current-category-ancestor > a,
.td-404-sub-sub-title a,
.widget_tag_cloud .tagcloud a:hover,
.td-mobile-close a,
ul.td-category a,
.td_social .td_social_type .td_social_button a,
.dropcap,
.td-forum-category-title .td-forum-category-name,
.td_display_err,
.td_block_mega_menu .td-ajax-next-page:hover,
.td_block_mega_menu .td_ajax-prev-page:hover,
.post-via span,
.td_wrapper_video_playlist
.td_video_controls_playlist_wrapper
{
background-color: #6e61b0;
}
.block-title,
.sf-menu li a:hover,
.sf-menu .sfHover a,
.sf-menu .current-menu-ancestor a,
.sf-menu .current-category-ancestor a,
.header-search-wrap
.dropdown-menu,
.sf-menu > .current-menu-item > a,
.ui-tabs-nav,
.woocommerce .product .woocommerce-tabs ul.tabs,
.td-forum-list-head,
.td-login-panel-title
{
border-color: #6e61b0;
}
.widget_price_filter .ui-slider-handle,
.td_wrapper_video_playlist .td_video_currently_playing:after
{
border-color: #6e61b0 !important;
}
.author-box-wrap .td-author-name a,
blockquote p,
.page-nav a:hover,
.widget_pages .current_page_item a,
.widget_calendar td a,
.widget_categories .current-cat > a,
.widget_pages .current_page_parent > a,
.td_pull_quote p,
.page-nav-post a:hover span,
.td-forum-last-comment-content .td-forum-last-author,
.td-topics-title-details a,
.td-posted-in a
{
color: #6e61b0;
}
.woocommerce .button,
.woocommerce .form-submit #submit,
.widget_price_filter .ui-slider-handle,
.jetpack_subscription_widget input[type=”submit”],
.pp_woocommerce .pp_close,
.pp_woocommerce .pp_expand,
.pp_woocommerce .pp_contract,
.pp_woocommerce .pp_arrow_previous,
.pp_woocommerce .pp_arrow_next,
.pp_woocommerce
.pp_next:before,
.pp_woocommerce .pp_previous:before,
#bbpress-forums .button
{
background: #6e61b0 !important;
}
.woocommerce .woocommerce-message,
.woocommerce .woocommerce-info,
.bbp-template-notice,
.td-reply-list-header
{
border-color: #6e61b0 !important;
}
.woocommerce .woocommerce-message:before,
.woocommerce .woocommerce-info:before,
.td-login-button
{
background-color: #6e61b0 !important;
}
.buddypress #buddypress div.dir-search input[type=”submit”],
.buddypress #buddypress .message-search input[type=”submit”],
.buddypress #buddypress .item-list-tabs ul li.selected a,
.buddypress #buddypress .generic-button a,
.buddypress #buddypress .submit input[type=”submit”],
.buddypress #buddypress .ac-reply-content input[type=”submit”],
.buddypress #buddypress .standard-form input[type=”submit”],
.buddypress #buddypress .standard-form .button-nav .current a,
.buddypress #buddypress .standard-form .button,
.buddypress #buddypress input[type=”submit”],
.buddypress #buddypress a.accept,
.buddypress #buddypress #activate-page .standard-form input[type=”submit”],
.buddypress #buddypress .standard-form #group-create-body input[type=”button”],
.post-password-required input[type=”submit”]
{
background: #6e61b0 !important;
}
.buddypress #buddypress .groups .item-meta,
.bbp-forum-title:hover,
.td_login_tab_focus,
.block-mega-child-cats a.cur-sub-cat
{
color: #6e61b0 !important;
}
.page-nav .current,
.page-nav-post span
{
background-color: #6e61b0;
border-color: #6e61b0;
}
.wpb_btn-inverse,
.ui-tabs-nav .ui-tabs-active a,
.post .wpb_btn-danger,
.form-submit input,
.wpcf7-submit,
.wpb_default,
.woocommerce .product .woocommerce-tabs ul.tabs li.active,
.woocommerce.widget_product_search input[type=”submit”],
.more-link-wrap,
.td_read_more {
background-color: #6e61b0 !important;
}
.header-search-wrap .dropdown-menu:before {
border-color: transparent transparent #6e61b0;
}
.td-mobile-content .current-menu-item > a,
.td-mobile-content a:hover
{
color: #6e61b0 !important;
}
.category .entry-content,
.tag .entry-content,
.td_quote_box
{
border-color: #6e61b0;
}
.td-timeline-block-title {
background-color: #6e61b0 !important;
}
.td-timeline-wrapper-links {
border-color: #6e61b0 !important;
}
.td-timline-h1-link span {
background-color: #6e61b0 !important;
}
.td-page-title .td-search-query {
color: #6e61b0;
}
.td-sbig-title-wrap .td-sbig-title,
.td-slide-item-sec .td-sbig-title-wrap,
.td-big-grid-title .td-sbig-title-wrap
{
background-color: rgba(110, 97, 176, 0.7);
}
::-moz-selection {
background: #a093e2;
color: #fff;
}
::selection {
background: #a093e2;
color: #fff;
}
a, .widget_recent_comments .recentcomments .url {
color: #6e61b0;
}
.cur-sub-cat {
color:#6e61b0 !important;
}
.blog-stack .sf-menu .current-menu-item a,
.blog-stack .sf-menu .current-menu-parent .current-menu-item a,
.blog-stack .sf-menu .current-menu-parent > a,
.blog-stack .sf-menu > li:hover > a,
.blog-stack .sf-menu ul li:hover > a,
.blog-stack .td-post-text-content .more-link-wrap:hover a,
.blog-stack .sf-menu ul .td_mega_menu_sub_cats a.cur-sub-cat,
.blog-stack .sf-menu ul .td_mega_menu_sub_cats a.cur-sub-cat:hover,
.blog-stack .td-mega-menu .block-mega-child-cats a:hover,
.blog-stack .td_mod_mega_menu:hover .item-details a,
.blog-stack .sf-menu .current-menu-ancestor > a,
.blog-stack .sf-menu .current-category-ancestor > a
{
color:#6e61b0;
}
.blog-stack .sf-menu > .current-menu-ancestor > a,
.blog-stack .sf-menu > .current-category-ancestor > a
{
color:#6e61b0 !important;
}
.blog-stack .sf-menu ul li {
background-color: #6e61b0;
}
.blog-stack .td-post-text-content .more-link-wrap a:hover {
outline-color: #6e61b0;
}
a:hover,
.widget_recent_comments .recentcomments .url:hover
{
color: #ed4fef;
}
.td-menu-header .td-sp,
.sf-sub-indicator{
background-image: url(‘http://cdn.rnbjunk.com/wp-content/themes/Newspaper/images/header/elements-menu.png’);
}
@media only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (-moz-min-device-pixel-ratio: 2),
only screen and (min-device-pixel-ratio: 2) {
.td-menu-header .td-sp, .sf-sub-indicator{
background-image: url(‘http://cdn.rnbjunk.com/wp-content/themes/Newspaper/images/header/elements-menu@2x.png’);
}
}
</style>
<!– JS generated by theme –>
<script>
var td_blocks = []; //here we store all the items for the current page
//td_block class – each ajax block uses a object of this class for requests
function td_block() {
this.id = ”;
this.block_type = 1; //block type id (1-234 etc)
this.atts = ”;
this.td_cur_cat = ”;
this.td_column_number = ”;
this.td_current_page = 1; //
this.post_count = 0; //from wp
this.found_posts = 0; //from wp
this.max_num_pages = 0; //from wp
this.is_ajax_running = false;
this.header_color = ”;
this.ajax_pagination_infinite_stop = ”; //show load more at page x
}
var td_ad_background_click_link=””;
var td_ad_background_click_target=””;
var td_ajax_url=”http://www.rnbjunk.com/wp-admin/admin-ajax.php”;
var td_get_template_directory_uri=”http://www.rnbjunk.com/wp-content/themes/Newspaper”;
var tds_snap_menu=”snap”;
var tds_header_style=””;
var tds_mobile_swipe=””;
var td_search_url=”http://www.rnbjunk.com/search/”;
var td_please_wait=”Please wait…”;
var td_email_user_pass_incorrect=”User or password incorrect!”;
var td_email_user_incorrect=”Email or username incorrect!”;
var td_email_incorrect=”Email incorrect!”;
var tds_more_articles_on_post_enable=””;
var tds_more_articles_on_post_time_to_wait=””;
var tds_more_articles_on_post_pages_distance_from_top=”0″;
var tds_theme_color_site_wide=”#6e61b0″;
</script>
Woocommerce, Buddypress, are some example and stuff like that. I cannot disable them from the theme panel, i need to know how can i customize the theme so use only the things that are really important for my site, without codes of stuff that are not working on it.
Do you have a guideline to have a lighter version of the theme, in order to load only the essentials?
Fabian
Hi,
Please copy the code exactly how I gave it to you:
@media (max-width: 767px) {
#td-top-menu .sf-menu {
display: none !important;
}
.blog-stack #td-top-search{
right: -50px;
top: -75px;
}
.header-search-wrap .dropdown-menu {
left: -56px!important;
}
.header-style-3 .td-logo img {
width: 30px;
}
.category .td-page-title span {
font-size: 20px !important;
font-family: Vollkorn !important;
}
}You forgot to close an } that’s why it bellow codes are apply on mobile.
Paste the codes in Theme Panel > Custom Css: http://screencast.com/t/ZLX09QoP
Thanks!
Ok I see it. The font only displays on mobile because of the first code.
@media (max-width: 767px) {
#td-top-menu .sf-menu {
display: none !important;
}
.blog-stack #td-top-search{
right: -50px;
top: -75px;
}
.header-search-wrap .dropdown-menu {
left: -56px!important;
}
.header-style-3 .td-logo img {
width: 30px;
}
.category .td-page-title span {
font-size: 20px !important;
font-family: Vollkorn !important;
}
I tried to separate each with a <style></style> but it seems this is not the proper way to do it.
Sorry I’m such a noob !!
Hi,
You can use Header style 4, but this will place the header ad bellow the menu also on desktop view, but I think that you know that already.
If you don’t want that you can try some custom modifications, so if you think that you don’t use header style 3 you can edit like this: http://screencast.com/t/lkgEkz1PaI – http://screencast.com/t/j1vA42wVUx7
custom_ad_1
Make this change in header.php: http://screencast.com/t/3Ok7opMJBIZ
Disable header ad on mobile view: http://screencast.com/t/6vl70FnD8
Paste your ad code in Custom Ad 1 and enable it for mobile: http://screencast.com/t/X7sRpdrLrW9c
Result:
Desktop view: http://screencast.com/t/9ivDNcpghz
Mobile view: http://screencast.com/t/39Z68Lz8
Thanks!
I am using header style 1
I would like to put the header ad below the menu and not above the menu
How can I change this ?
Hi,
1. I’m not sure what you mean with created a sidebar as a widget. You can create a custom sidebar from Theme Panel > Template Settings(you can choose a different sidebar for each template) for posts for example: http://screencast.com/t/1Q7yZTzG And it is normal to find it empty in Widgets section, just add widgets to it: http://screencast.com/t/cUctIPwK5tc
And set it to display: http://screencast.com/t/h7SQeDjTM
Result: http://screencast.com/t/88S4IiqgYpZB
2. You use Header Style 3 with blog-stack that why is that issue on mobile. For Classic Block stack we made a special header, this one http://screencast.com/t/FEoXVhLMpcv and in combination with other headers is not guaranteed that everything will work fine.
So if you want to use it like this, please paste this css for mobile view in Theme Panel > Custom Css:
@media (max-width: 767px) {
#td-top-menu .sf-menu {
display: none !important;
}
.blog-stack #td-top-search{
right: -50px;
top: -75px;
}
.header-search-wrap .dropdown-menu {
left: -56px!important;
}
.header-style-3 .td-logo img{
width: 30px;
}
}
Result: http://screencast.com/t/0e2v9SlcLw4e
Thanks!
Hi,
You can use this custom css in Theme Panel > Custom Css: http://screencast.com/t/MGhkwxsVegHO
.td-header-top-menu {
display: block !important;
}
Result: http://screencast.com/t/q2DYx26Abfa
Please also note that the top menu hasn’t been designed to be used on mobile screens so you might need additional customization to it.
Thanks!
In case someone need this, here is the easy full steps for a separate mobile menu.
(line number for NewsMag theme v1.5)
1) themedir \parts\menu-mobile.php
Line 18 change to 'theme_location' => 'mobile-menu',
2) themedir \includes\wp_booster\td_menu.php
Line 9 change to var $is_header_menu_mobile = false;
@wishdigital: you just need to modify here.
3) same file as 2)
Line 235 add this line 'mobile-menu' => 'Mobile Menu',
before 'footer-menu' => 'Footer Menu'
That’s it. Of course you need to create a new menu for the “Mobile menu”.
Hope this help.
Hello
Can anyone tell me, how i can display the top menue on mobile devices
LG, Thomas
