- NewsmagtagDiv Composer Tutorial
- NewsmagBlock settings tutorial
- NewsmagLogo & Favicon
- NewsmagFooter templates
- NewsmagUsing other ads
- NewsmagUsing Typekit fonts
Hi,
I think that you can try a css like this one -> https://i.imgur.com/6071BoZ.png
.meta-info .td-editor-date{
display: none;
}
.page .td_module_mx1 .entry-title{
font-size: 16px!important;
line-height: 14px!important;
}
.td_block_14 .td-block-span6:nth-child(even) {
margin-left: 1%;
}
Set the css in theme panel> custom code> advance css > phone.
Thank you!
Hi, maybe is not the same but is closer -> https://i.imgur.com/wjNjJTw.png please set this code
.td-main-menu-logo img {
max-height: 106px;
margin-top: -16px;
}
.td-header-wrap {
height: 84px;
}
#td-top-mobile-toggle i, .td-search-icon i {
line-height: 86px;
}
in theme panel> mobile theme> custom code> css.
Hope it will help you!
Hi,
1. In order to make this demo full width, you need to make sure that the BACKGROUND BOXED LAYOUT from theme panel is disable -> https://i.imgur.com/eOgfwBH.png and edit it using tagDiv Composer -> https://i.imgur.com/i5IUJ9E.jpg select a row and stretch it after your needs -> https://i.imgur.com/WKYebPX.jpg -> https://i.imgur.com/TO1BZ3M.png -> https://i.imgur.com/Yq8UCv3.jpg
This -> https://i.imgur.com/zTgqCHu.png can be done by editing the homepage with tagDiv Composer and click on the trending to set a margin top to be move from under the css code -> https://i.imgur.com/jkCYD4b.jpg
2. Please make a test and see when you scroll to top the header is displaying? if yes then you have set the snap not the sticky menu, use tagDiv Composer to make the changes -> https://i.imgur.com/ePPILZs.png
Thank you!
Hi,
I think that the plugin provide as example in this topic -> https://forum.tagdiv.com/topic/minify-css-js/#post-362759 can do this, to optimizes the images.
Than you!
Hi, I just checked your website and now there is nothing that is larger then the normal space, but still the mobile version is not displaying right.
Please remove (copy the css in a txt file or something) all css from theme panel and check again.
Let em know if after this the mobile version is look normal.
Hi,
Some elements like flex grids and flex block can be change per view port in tab layout and css.
Unfortunately the General tab can not be change per view ports, sorry.
Thank you!
which plugin is best to minify css and js for this theme?
Hi,
Please try this custom css
https://i.imgur.com/elZNjG1.jpg
.td_module_flex_1 .td-module-thumb a:last-child:before {
bottom: 0;
content: "";
display: block;
height: 80%;
width: 100%;
position: absolute;
z-index: 1;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0)), color-stop(100%, rgba(0, 0, 0, 0.7)));
background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.7) 100%);
background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.7) 100%);
}
Hope this will help you!
Hi,
Can we only change the viewport settings for the CSS of each block, or should it be able to be changed for the other categories of customization (General, Filter, Layout, Style, etc)? I’m wanting to limit the number of posts that show based on what view the user is on, so that there’s only enough to fill one row. Is there a better way to do this?
Thank you!
Hi,
That option is custom made of that grid, since you made your own layout you need t use a custom css to achieve that layout too and this is not quite easy.
I’m not sure exactly how to do it that i think that this custom css can help you
.td_block_14 .td-block-span6{
width: 49%!important;
}
.td_block_14 .td-block-span6:nth-child(even){
margin-left: 2%;
}
.tdi_37_bb9{
display: flex;
flex-direction:column-reverse;
}
Also is need for some more customization too.
Thank you for your understanding!
Has this one the CSS and js minification option? Many thanks for your help
Hi,
I’ve seen this before to some users, and this problem was caused by some untested plugins, please check the extra plugins you are using. Also if you want I can take a look at your mobile version and provide a custom css to make it to look normal.
Thank you!
Hi Christoph,
I think that the problem is with the place that I indicate to set the code. remove the code from custom css and add it in advance css for the device that you want to have this type o menu -> https://i.imgur.com/QAYEiiR.png
Unfortunately for the moment our theme do not have this option to display a sidebar menu like these that you provide as example, sorry!
Thank you for your understanding!
Hi,
You can use the filter from the block to choose the categories you want to display, but if you have more categories add for the same block and you want to have this design only for when you chose one of theme, the there is no option.
Or if you want do display only some categories name and for others posts with others categories to by hide, then you can do it only with custom css.
Thank you!
Hello !
Please use this css code: amp-mode-touch,.td-crumb-container{
display:none;
}
amp-mode-touch,.comments{
display:none;
}
amp-mode-touch,.author-box-wrap{
display:none;
}
amp-mode-touch,.td-post-next-prev-content{
display:none;
}
amp-mode-touch,.td-post-source-tags{
display:none;
}
amp-mode-touch,.td-category{
display:none;
}
amp-mode-touch,.td-post-comments{
display:none;
}
The codes must be inserted here: https://www.screencast.com/t/fyP7TBVPWvhQ
Thank you !
Hi dessy1991,
There are few elements that can be use, but I think that using flex block 1 you can achieve what you need for this sidebar layout -> https://forum.tagdiv.com/flex-block-settings-guide/ if you want you can import a block and just edit it https://i.imgur.com/WShZTNk.png -> https://i.imgur.com/wczICzK.png also the icon for audion need to be set there with a custom css, if you wan, after you set the block I can inspect the sidebar and provide a custom css to make the layout like in your example.
Thank you!
Hi,
1. You can use the scroll to see all the elements from tagDiv Composer sidebar -> https://i.imgur.com/HmgXmYt.png -> https://i.imgur.com/PXgDj9t.png
2. Yes, this can be done in more ways, you can edit the homepage with tagDiv Composer and set for each block different categories -> https://forum.tagdiv.com/block-settings-guide/ or best you can use the option for Unique articles on pages -> https://forum.tagdiv.com/unique-articles/
3. Yes, you can do this with tagDiv Composer, add a new row and choose a layout -> https://i.imgur.com/yXqbdRv.png after that select each empty column and in css tab set the width you want to have -> https://i.imgur.com/QWT6Fhm.jpg -> https://i.imgur.com/AJSB4Y9.jpg -> https://i.imgur.com/F10WDmf.jpg
4. You can have a different layout if you are using the mobile theme plugin -> https://forum.tagdiv.com/the-mobile-theme/ also for responsive version you can use flex blocks and grids and these can be edited per view port.
5. our tagDiv Composer is the theme builder and the closer one that can be use, using only the mouse and clicks.
6. Indeed for the moment our theme do not have this option and we also do not tested any plugin for Membership, usually we recommend to users to try the best recommend plugins and choose the one that is working better -> https://www.justlearnwp.com/wordpress-membership-plugins/
Hope this will help you!
Thank you!
Hi statenewsnation, in order to make this demo full width, you need to disable the BACKGROUND BOXED LAYOUT from theme panel -> https://i.imgur.com/eOgfwBH.png and edit it using tagDiv Composer -> https://i.imgur.com/i5IUJ9E.jpg add or select a row and stretch it after your needs -> https://i.imgur.com/WKYebPX.jpg -> https://i.imgur.com/TO1BZ3M.png -> https://i.imgur.com/Yq8UCv3.jpg
This -> https://i.imgur.com/zTgqCHu.png can be done by editing the homepage with tagDiv Composer and click on the trending to set a margin top to be move from under the css code -> https://i.imgur.com/jkCYD4b.jpg
Hope this will help you!
Thank you!
Hello !
I am sorry for misunderstanding !
Please use this css code in order to change that color: .td-animals-pro .td-post-content
img {
border-color:Red;
}
The code must be inserted here: https://www.screencast.com/t/J1Nxw5s5
Thank you !
Hello !
Please use this css code: .td-container, .tdc-row, .tdc-row-composer {
width: 1200px;
}
The code must be inserted here: https://www.screencast.com/t/J1Nxw5s5
Thank you !
I’ve reviewed and followed the most recent Typekit instructions as provided by tagDiv admins, but it’s still not working.
By not working, I mean after implementing the link to the stylesheet (in Theme Fonts panel) and selecting the custom font family, the font for the assigned field sometimes changes and sometimes doesn’t. If it does change, it doesn’t represent the actual font specified in Typekit, but shows up as some sort of general serif font.
To confirm the process, here’s what I’m doing:
– Add no more than 3 fonts to an Adobe Font Web Project.
– Insert the embed code into the Embed Code field in the Adobe/Typekit fonts page on the theme panel. Code looks like this: <link rel=”stylesheet” href=”https://use.typekit.net/bzn7dry.css”>
– Add the appropriate names in the Custom Font Fields in the theme panel.
– Using the tagDiv composer, attempt to edit the Block or Module fonts by selecting the name(s) I’ve entered in the Custom Font Fields.
Wordpress and the theme is fully updated.
Looking for troubleshooting ideas and/or solutions. Thanks in advance.
Thanks for detailed explanation, Calin!
And thanks again for your time! 🙂
You told: “Is look that you set an inline css in your code -> https://i.imgur.com/5BtoKb4.png if you remove that padding-left: 40px!important; the banner will be display like this -> https://i.imgur.com/ZDGrwdr.png”
Unfortunatly, in Mobile version I couldn’t center banner by those options – https://prnt.sc/u6freu
It couldn’t set center, that’s why I had to move it padding-left. 🙁
I can’t explain what’s it was.
Hi,
This is not so easy to do since there is no option on read more button to ad an icon.
You can try to add an icon or image as in this guide -> https://krasimirtsonev.com/blog/article/CSS-before-and-after-pseudo-elements-in-practice
Hop this will help!
Hi,
I think that you are referring to this space -> https://i.imgur.com/RUnzvby.png
In order to remove the gap you can edit the page and set to the first row a margin top
-40 https://www.screencast.com/t/XHpfT49oE9U or you can use custom css -> https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/
-> https://i.imgur.com/jGHYu2s.png
.td-main-page-wrap {
padding-top: 0px;
}
This code need to be set in theme panel> custom code> custom css.
Hope it will help you!
Hello !
That can be achieved by adding an extra class and hiding / showing the element using CSS. As you can see here I have added a flex block but you can use any element, added the weekend extra class: https://www.screencast.com/t/jhxUUGEG6ow ; And using this code I can hide it or show it whenever I want:
https://www.screencast.com/t/AAtH03H7JKs
The code is: .weekend {
display:none;
}
The code must be inserted here: https://www.screencast.com/t/J1Nxw5s5
When you want to hide it simply set the class to none and when you want to display it set it to block
Thank you !
