- NewspaperThe Newspaper Mobile Theme: Introduction
- NewspaperThe Mobile Theme
- NewspaperModules Builder in Newspaper Theme
- NewspaperFilters and sorting for taxonomies
- NewspaperHow to Add a Logo in Newspaper
- NewspaperBig Grid Flex Settings
- NewspaperHeader Builder
- NewspapertagDiv AMP Plugin Tutorial
- NewspaperNewspaper theme documentation
- NewspaperBest Of Forums
- NewspaperCache plugin – install and configure
- NewspaperFont Customization
- NewspaperTheme Colors Introduction
- NewspaperBackground Introduction
- NewspaperHeader ads
- NewspaperPost template ads
- NewspaperCustom ad spots
- NewspaperMain Menu
- NewspaperHow to Install Newspaper via FTP
- NewspaperHow to Install Newspaper via WordPress
My site, laxpipe.com is not formatting properly for mobile devices.
I took care of the Jetpack recommendation, but it is still not being displayed properly.
I’m wondering if I missed a step.
Thanks in advance.
Erik
Thanks Lucian,
Maybe you misunderstood what I meant. I really want the links of parent categories work, but they don’t work on touchscreen devices now.
What I want is that when I click on the parent category, it should go to the link of that parent category. But I have problems with only Chrome on all touchsreen devices, including laptops, tablets. They don’t work now.
I don’t know what go wrong with my settings.
PS: I have no problems with normal PC at all (I meant UNtouchsreen devices) and the mobile view also work well on all devices.
Hi,
Please use this custom css in Theme Panel > Custom Css to hide More Author Box on mobile: http://screencast.com/t/moeFEwUQ
@media (max-width: 767px) {
.td-more-articles-box{
display: none;
}
}
Thanks!
I would like to remove More Article Box popup on mobile but retain it on Desktop/Laptop.
There is currently no option to do that via theme’s panel.
TIA.
hello,
after updating the template I have a problem with mobile menu. http://prntscr.com/6h0ld6
http://zator24.pl page
greet.
Hi,support.
thank you for nice template.
I have a problem with the logo on mobile.
I changed the logo but, it still “News Paper”logo on my I Phone.
It is my logo on laptop,but how can I change the logo for mobile?
thank you.
Daniel
Update: If you scroll down on the facebook popup you will see a second little button – I would like both links to go to the app on mobiles but if that’s not possible than at least the little like button.
Thanks
Hi there,
On my website, http://www.purrlypress.com/, I added a popup with a link to facebook. (if you go there wait a few seconds and it should appear). I would like this link (the image) to go to the facebook app for when a user is using mobile as most users aren’t logged into fb on the web. Can you please advise on the code to use for this and where to put it?
Thanks very much
Hello, is there any way to set the mobile menu to a larger screen width? I have a large menu and when I use an horizontal ipad screen, the menu splits in two.
I tried lower the font size and padding, but it is not enough. I need the mobile menu to be activated at a larger screen width.
Thanks!
Hi,
I’ve tested your site on mobile but haven’t found any issues the content is loaded fine. If you’re still experiencing issues with this try without any plugins, empty cache and purge files then try again.
Also consider disabling any js/css/html compression as it could also cause issues.
Please let me know how it goes and provide more details about this.
Thanks
first thing I need change full website font for custom font I make it in css but it change some places only
and see shots below please cos I’m web host company and I will work with your templates and need you give me a hand to buy more so I need to fix this asap
1 – I need to change footer color to black.
2 – big slide need change thumbnails position to left screen shot below
http://2up.pw/uploads/1426157553831.jpg
3 – any widget header aligned to the left ?
4 – I need to make custom ads 2 and 3 at web site sides how to make it what is the ads short code and how to make body fixed cos its so wide so that side ads cover logo check this
http://2up.pw/uploads/1426157697241.jpg
and tell me how to hide it from mobile and tablets
5- rtl issue in menu please check this
http://2up.pw/uploads/1426157777891.jpg
need to fix it and tell me how to change its fonts
6- blocks font how to change it please cos I change it in menu and other places don’t know how to fix it
check below shot
http://2up.pw/uploads/1426158121462.jpg
please tell me how to fix this and you should make every sing trl so that we not face problems any more
I’m having an issue I can’t seem to figure out. While loading my website: http://starbuckssecretmenu.net/ on my mobile browser, pages seem to load from the middle or bottom of the page as opposed to the top of the page where they should. They will appear to load from the top then do a page jump to the bottom. It’s making it rather difficult to navigate the site properly. This is in Chrome using an Android device.
Any advice would be much appreciated.
Yes i made the corrections to the 479 px @media and it was okay! I checked the } -mark and its okay..
I still have problem with this video Play button showing up on the right http://www.screencast.com/t/UYEF9Wbi5s
And also i didnt get the 4) part made : 4) My mobile shows homepage post images too large, more than full screen size. How can i make these smaller, maybe like this, just on the mobile landscape mode ? http://www.screencast.com/t/MVr7oxewTjZO
Because now its like this, and you have to scroll really hard down to see the title and excerpts : http://www.screencast.com/t/qvljiAW0NY2 .
Thanks for your help, but how come some of my @media is still working with out 2 } – marks ?
There’s a problem in the code that you gave me for the posts order in category, the code effect the category in mobile! http://www.wata.cc/up/2015/03/images/w-cd655f6976.png
.archive .span8.column_container .span6:first-child {
float: right;
margin-left: 4%;
}
.archive .span8.column_container .span6{
margin-left: 0;
}
Thank you Alin
That’s very good
1- For the mega menu posts please see this (Move the posts) http://www.wata.cc/up/2015/03/images/w-da176923a9.jpg
2- And please I need to do for the blocks in the homepage the same thing that we did for categories (posts order)
http://www.wata.cc/up/2015/03/images/w-796ab9734a.jpg
3- When I try to do a search (In desktop and mobile) the button is on the writing
http://www.wata.cc/up/2015/03/images/w-7dca45d378.jpg
Thanks a lot
Sorry for the inconvenience
Hello,
I have a problem with the header logo in mobile mode.
I have saved the setting in the header section but I have this result:
http://it.tinypic.com/r/16c9rb8/8
I see the logo BELOW the menu bar and not over:
how can I fix?
Thanks
Hey everybody!
It’s been more than a couple months since I purchased Tagdiv’s Newspaper Theme from the Envato Market. I have to confess, I’ve been really happy with my purchase. There were no issues with the theme, everything worked (and is working) perfectly fine. The responsive layout is awesome. The theme looks fabulous in all resolutions and the support forum is very welcoming and kind. I believe I must thank tagdiv for that.
Since a couple of months using the theme, given that the next version of Newspaper (5.0) is approaching, I thought I could may be chip in a few more suggestions, minor bug-fixes and ideas that will help the theme achieve greater appeal. Please let me know if I am at all helpful:
A Few Bugs:
1. As I mentioned earlier in another post, the big slider with background is malfunctioning on mobile devices, if using a boxed layout. I’d really love to see this fixed:
2. The default slider requires all images to be at least 1024px wide to show properly on all devices. Since such large images are hard to come by easily, I’d really love it if the slider is made compatible to work with smaller images as well, something like what Revolution Slider does.
Some Features:
3. A Magazine Stack: Since many people running Newspaper are magazine sites, I think it will be nice to add a “Magazine” stack to Newspaper, with functionalities such as the Newsmag slider, smart sidebar, carousel sliders for posts, a sleeker look mimicing Newsmag, etc. Given that Newspaper is more popular (and costlier) than Newsmag, I think it’s probably a good idea.
4. A Better Mega-Menu: I’d really love some additional work done on the mega-menu used by Newspaper 5, so that it is as feature-rich as Newsmag.
5. Additional Customizability: It’ll be great if the Theme editor comes forth with more customizability, with the ability to customize the looks of the main menu, ios slider, social counter, etc.
6. A Responsive theme editor: I was a bit taken aback when I noticed that the WP Booster theme editor is not mobile or tablet responsive. I’d love to see that fixed.
7. A few other suggestions mentioned here: https://forum.tagdiv.com/topic/a-few-suggestions-for-the-upcoming-version-of-newspaper/
8. A Sleeker, more modern look all around. I’d really appreciate it, and I think so will everyone else, if you could power Newspaper 5 with a more modern look, with features like post carousel slider, multiple featured sliders, etc., you know, just to keep in touch with time.
Thanks a lot for taking the time to consider my suggestions. Hope I am not imposing. 🙂
Hi!
And thank you for your help!
The first one worked great for me, thanks for that, but when i flip the ipad from portrait mode to landscape the play icon leaves to the side from the sidebar like this : http://www.screencast.com/t/UYEF9Wbi5s
This is the full mobile css that i have added now:
@media (max-width: 767px) {
.wpb_widgetised_column {
display: none;
}
@media (max-width: 767px) {
.td-main-sidebar {
display: none !important;
}
@media (max-width: 767px) {
.container .span12 .row-fluid .span4 {
display: none;
}
.td_mod8 .item-details {
margin-left: 0 !important;
margin-bottom: 10px;
}
.td_mod8 .thumb-wrap img {
position: relative !important;
width: 100% !important;
max-width: none !important;
max-height: none !important;
margin-bottom: 10px;
}
}
@media(max-width:479px){
.home .td_block_big_grid{
display: none;
}
.home .td-grid-wrap {
padding: 0px !important;
}
@media (max-width: 767px) {
.container .span12 .row-fluid .span4 {
display: none;
}
}
@media (max-width: 767px) {
.td_mod8 .meta-info,
.td_mod8 .td-post-text-content {
display: none;
}
.td_mod8 .item-details {
margin-left: 0 !important;
margin-bottom: 10px;
}
.td_mod8 .thumb-wrap img {
position: relative !important;
width: 100% !important;
max-width: none !important;
max-height: none !important;
margin-bottom: 10px;
}
@media (max-width: 767px) { #td-top-search { position: absolute!important; right: 13px!important; top: 0px!important;
}
.header-search-wrap .dropdown-menu:before { left: auto!important; right: 31px!important;
}
.header-search-wrap .dropdown-menu { right: -14px!important; left: auto!important; top: 49px!important; width: 320px!important;
}
.mobile-logo-wrap img { width: 170px; position: absolute; left: 0; top: -3px; margin-left: auto; margin-right: auto;
}
}
@media (min-device-width : 375px)(max-device-width : 667px)(orientation : landscape){
position: relative !important;
width: 100% !important;
max-width: none !important;
max-height: none !important;
margin-bottom: 10px;}
@media (min-width : 375px) and (max-width : 667px) and (orientation : landscape){ .single img{ max-width: 50%; } .td-post-featured-image{ text-align: center; } }
Hi,
1) Try the following css:
@media (min-width: 767px) and (max-width: 1018px){
.td_block9 .td_mod8 .thumb-wrap img {
position: relative;
}
.td_block9 .td_mod8 .item-details {
margin-left: 0px;
margin-top: 10px;
}
}
2) It comes from a css which changes the stile for that section, try this one:
@media (min-width: 768px) and (max-width: 1199px){
.span8 > .td_mod8 .item-details {
margin-left: 366px !important;
}
.span8 > .td_mod8 .thumb-wrap img{
max-width: 326px !important;
max-height: 235px !important;
}
}
3) The image cannot be made taller without increasing it’s width (to maintain aspect ratio), by doing this you have to compress the text on the right side.
4)You could try to set a different size for mobiles using media queries:
ex:
@media (max-width: 767px) {
...
}
I don’t know what you’re using there so i cannot provide a precise css.
5) What css did you used? please paste it here so i can take a look.
@space above big slider on mobile – try this css:
@media (max-width: 767px) {
.td-page-wrap .td-grid-wrap {
padding-top: 0px;
}
}
Thank you, Emil G.
-
This reply was modified 11 years by
Emil G.
Why this css appear in template when view source, how to hide or remove it:
My site: http://www.baihocmoi.com/
<script type="text/javascript">/*<![CDATA[*/jQuery(document).ready(function(){var ajaxRevslider=function(obj){var content="<h2>THIS IS SOME TITLE</h2><br/>";content+="Type:"+obj.type+"</br>";content+="ID:"+obj.id+"</br>";content+="Aspect Ratio:"+obj.aspectratio+"</br>";data={};data.action='revslider_ajax_call_front';data.client_action='get_slider_html';data.token='1a59f464b3';data.type=obj.type;data.id=obj.id;data.aspectratio=obj.aspectratio;jQuery.ajax({type:"post",url:"http://www.baihocmoi.com/wp-admin/admin-ajax.php",dataType:'json',data:data,async:false,success:function(ret,textStatus,XMLHttpRequest){if(ret.success==true)
content=ret.data;},error:function(e){console.log(e);}});return content;};var ajaxRemoveRevslider=function(obj){return jQuery(obj.selector+" .rev_slider").revkill();}
var extendessential=setInterval(function(){if(jQuery.fn.tpessential!=undefined){clearInterval(extendessential);if(typeof(jQuery.fn.tpessential.defaults)!=='undefined')
jQuery.fn.tpessential.defaults.ajaxTypes.push({type:"revslider",func:ajaxRevslider,killfunc:ajaxRemoveRevslider,openAnimationSpeed:0.3});}},30);});/*]]>*/</script><!--[if lt IE 9]><script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script><![endif]--><meta name="generator" content="Powered by Visual Composer - drag and drop page builder for WordPress."/> <!--[if IE 8]><link rel="stylesheet" type="text/css" href="http://www.baihocmoi.com/wp-content/plugins/js_composer/assets/css/vc-ie8.css" media="screen"><![endif]--><style type="text/css">img.latex{vertical-align:middle;border:none}</style><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:#d93}.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:#d93}.widget_price_filter .ui-slider-handle,
.td_wrapper_video_playlist .td_video_currently_playing:after{border-color:#d93 !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:#d93}.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:#d93 !important}.woocommerce .woocommerce-message,
.woocommerce .woocommerce-info,.bbp-template-notice,.td-reply-list-header{border-color:#d93 !important}.woocommerce .woocommerce-message:before,
.woocommerce .woocommerce-info:before,.td-login-button{background-color:#d93 !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:#d93 !important}.buddypress #buddypress .groups .item-meta,
.bbp-forum-title:hover,
.td_login_tab_focus,
.block-mega-child-cats a.cur-sub-cat{color:#d93 !important}.page-nav .current,
.page-nav-post
span{background-color:#d93;border-color:#d93}.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:#d93 !important}.header-search-wrap .dropdown-menu:before{border-color:transparent transparent #d93}.td-mobile-content .current-menu-item > a,
.td-mobile-content a:hover{color:#d93 !important}.category .entry-content,
.tag .entry-content,.td_quote_box{border-color:#d93}.td-timeline-block-title{background-color:#d93 !important}.td-timeline-wrapper-links{border-color:#d93 !important}.td-timline-h1-link
span{background-color:#d93 !important}.td-page-title .td-search-query{color:#d93}.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(221,153,51,0.7)}::-moz-selection{background:#ffcb65;color:#fff}::selection{background:#ffcb65;color:#fff}.post header h1, .post header h1
a{font-family:Tahoma,Verdana,Geneva}.td_mod_mega_menu .item-details
a{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:14px}</style><script>var td_blocks=[];function td_block(){this.id='';this.block_type=1;this.atts='';this.td_cur_cat='';this.td_column_number='';this.td_current_page=1;this.post_count=0;this.found_posts=0;this.max_num_pages=0;this.is_ajax_running=false;this.header_color='';this.ajax_pagination_infinite_stop='';}
var td_ad_background_click_link="";var td_ad_background_click_target="";var td_ajax_url="http://www.baihocmoi.com/wp-admin/admin-ajax.php";var td_get_template_directory_uri="http://www.baihocmoi.com/wp-content/themes/Newspaper";var tds_snap_menu="";var tds_header_style="";var tds_mobile_swipe="swipe";var td_search_url="http://www.baihocmoi.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="#dd9933";</script>
I guess this isn’t just a mobile screen issue, but I need a solution for other smaller screens (like netbooks) as well.
Thanks.
Philip
Hello,
Good day! In mobile view on some tablet devices, one or more of my Main Menu items wrap to the next line. Since my Main Menu has a background color, I was hoping you could provide me with a way to wrap the color to the next line (full width) so that my wrapped menu items show up properly and my menu background appears uniform.
I hope you have a solution for this.
Philip
Thank you for your advice, but i ment the gap in the mobile view. Sorry, i think i forgot to mention that properly.
I made a totally new topic for all my problems now 🙂 thanks for all
If you have some advice for me you can visit : https://forum.tagdiv.com/topic/ipad-and-mobile-homepage-post-image-size-problems/
Thank you so much for your help !
Hello!
First of all thank you for your time viewing my mobile and ipad issues!
I have these problems:
1) When i’m on an Ipad the portait mode looks like this in my Block 9 posts: http://www.screencast.com/t/BX8ZnV4e0 . How can i make the title and excerpt go to the bottom of the picture ?
Or if that’s not possible, how can i make these pictures smaller so the titles and excerpts look good ?
2) Ipad Landscape mode looks like this on the Latest articles/ Article list: http://www.screencast.com/t/uZRAfFyJ1g . How can i make these images go bigger like this : http://www.screencast.com/t/insdMSaj . Because when you visit my site http://www.sketsi.fi , you can see that the post images are correct size on Ipad Landscape mode, but when you scroll down and get to the Article list, it shows the post images in a smaller size.
3) Ipad portait mode also shows the Latest article list pictures smaller than it should be , so how can i get those bigger ? http://www.screencast.com/t/ajq8xs2Hlg
4) My mobile shows homepage post images too large, more than full screen size. How can i make these smaller, maybe like this, just on the mobile landscape mode ? http://www.screencast.com/t/MVr7oxewTjZO
Because now its like this, and you have to scroll really hard down to see the title and excerpts : http://www.screencast.com/t/qvljiAW0NY2
5) I managed to get the website logo in the middle and the search logo on the right, but only in the mobile portait mode like this http://www.screencast.com/t/cSstk8tc12 . How can i also make this the same in the mobile landscape mode ? now its like this: http://www.screencast.com/t/5oQkd4gQ0 .
And there is also a gap between the menu and the big slider in the mobile landscape view.
I had the same thing in mobile portait mode, but the texts were way too big and the gap was confusing, so i had to disable it. Any suggestions on these ?
Hi,
1. Please try this custom css to hide subcategories from mobile menu in Theme Panel > Custom Css: http://screencast.com/t/yRuT7Fge8Vp
.td-mobile-content .sub-menu{
display: none;
}
2. For megamenu use this css code:
.td_mod_mega_menu{
float: right;
}
Result: http://screencast.com/t/07b9plER – http://screencast.com/t/mqFR1oy5
3. Also for category pages: http://screencast.com/t/pP96VMwBqX
.archive .span8.column_container .span6:first-child {
float: right;
margin-left: 4%;
}
.archive .span8.column_container .span6{
margin-left: 0;
}
Please search also on the forum there are many rtl threads that may can help you: https://forum.tagdiv.com/search/rtl/
-
This reply was modified 11 years by
Alin [tagDiv].