Search Results for 'css'

Hi Chris S, indeed it would be great!

A little advice for that users who will want to use this improvement for Speed-booster plugin.

Using this code in combination for example with that one provided by Chris S in his [tutorial], you’ll have a double-edged knife (you’re warned! 🙂 ) if not used with caution.

Good to know: even if you update your theme to a new version, browsers/CDNs/… and in the end users, they all not recognize your changes until your rules for “Expire headers” will expire! and I’m sure that you’ll go crazy the tagDiv staff 🙂 with: “my users not seen me changes/updates” or similar.

In addition it should be recalled that a normal users (visitors) which makes search on Internet, will not erase the cache from their devices to see our web (recent version).
So, if you are use this snippet, use it with precaution in combination with an flexible time for expire headers depending on your activity!

Can be controled also by Cache-Control Headers but that’s another story apart

———-
Summary to remove query strings from static resources with Speed-Booster enabled:

• For functions.php (a slim version 🙂 )

function remove_js_ver( $src ) {
if( strpos( $src, '?ver=' ) )
$src = remove_query_arg( 'ver', $src );
return $src;
}
add_filter( 'script_loader_src', 'remove_js_ver', 10, 2 );

• For td-speed-booster.php

foreach ($this->style_footer_queue as $style_id => $wp_dependency_object) {
            if (strrpos($wp_dependency_object->src, '?') === false) {
                echo "<link rel='stylesheet' id='" . $style_id . "-css'  href='" . $wp_dependency_object->src . "' type='text/css' media='" . $wp_dependency_object->args . "' />\n";
            } else {
                echo "<link rel='stylesheet' id='" . $style_id . "-css'  href='" . $wp_dependency_object->src . "' type='text/css' media='" . $wp_dependency_object->args . "' />\n";
            }
        }

Good luck and nice/big traffic to all.

All thanks must go to Andrei L. because he provide us this custom work.

• This reply was modified 9 years by nairolf.

There is no real way to do this in responsive design without using tables, as CSS is designed to “float” based on browser, content width, etc. — so, if you set a fixed height and somebody did a zoom, text would be chopped off. If the browser viewport changes and the text drops onto another line, the last line would get chopped off, etc.

This is why we usually use modules where image is on top, then the headline so that the “apparent” height of the photos across a horizontal row looks more consistent.

The old way was to use tables, where the headline would be in a table cell, photo in cell, excerpt in cell; but the webdev world decided tables were bad (stupid). Bootstrap 4 is doing some cool things as workaround for this kind of issue, but in normal CSS no real way to do that very well.

Try using module with photo on top, then the headline, and see how that looks. 🙂

(( CORRECT ME IF WRONG! ))

is it possible to add some CSS container with fixed height for title ? In this case Title verical size will be the same for all string length.

Hi

Try this css in theme panel > custom code > custom css:

@media(max-width: 768px){
.header-search-wrap .td-icon-search{
color: black;
}
}

Thanks!

Hi

I’ve made an additional tests and seems that the scripts moved by speed booster in footer can’t be accessed by that function. Instead you can try to remove the query string directly from Speed Booster, just replace the original code with this one: http://screencast.com/t/bMhSDZwi

        foreach ($this->style_footer_queue as $style_id => $wp_dependency_object) {
            if (strrpos($wp_dependency_object->src, '?') === false) {
                echo "<link rel='stylesheet' id='" . $style_id . "-css'  href='" . $wp_dependency_object->src . "' type='text/css' media='" . $wp_dependency_object->args . "' />\n";
            } else {
                echo "<link rel='stylesheet' id='" . $style_id . "-css'  href='" . $wp_dependency_object->src . "' type='text/css' media='" . $wp_dependency_object->args . "' />\n";
            }
        }

Hope this help!
Thanks!

Hi

Try to replace the previous css wit this one, it will remove the link from featured image and post title on category page:

.category .td-module-image, .category .entry-title{
pointer-events: none!important;
}

Thanks!

Hi

Your layout issues are related with the custom css used.
You added a fixed value the width of td-outer-wrap container which breaks the mobile layout, check this screen: http://screencast.com/t/fJ4GsKMuus Use media queries to change that value for mobiles: http://screencast.com/t/1o8RKZmED

@media (max-width: 768px){
.td-boxed-layout #td-outer-wrap {
width:100%
}
}

You also need to remove this margin left added on this row: http://screencast.com/t/kcb6BupP12

@media (max-width: 768px){
.vc_row.vc_row-flex{
margin-left: 0px !important;
}
}

Thanks!

Hi

You can try something like this:
add_filter( 'style_loader_src', 'remove_cssjs_ver', 1005, 2 );
1005 is the priority value, you need a small priority for this hook if speed booster is used. In this case a higher number means a smaller priority.

Hope this helps!
Thanks!

HI

Wp Rocket is not among tested plugins and we can’t provide an accurate answer why it breaks theme’s functionality. From other reports some of the plugin’s features, like page caching works fine, but some of them like css/js minification are known to create issues with our theme.
The child theme is not required, it’s optional and you can use it to customize theme’s features, for example change a post template. Please check this links for more details in this regard: https://codex.wordpress.org/Child_Themes – https://forum.tagdiv.com/the-child-theme-support-tutorial/

Thanks!

Hi

Please refer to our documentation for more details in page-speed regard: https://forum.tagdiv.com/how-to-make-the-site-faster/ Try to optimize the images following google’s docs: https://developers.google.com/speed/docs/insights/OptimizeImages Also you can use leverage browser cache to reduce the size of the css/js resources served by the server: https://gtmetrix.com/leverage-browser-caching.html
To minify js you can use Speed Booster plugin which loads the minified version of js for the theme. Also for css you can try clodflare; https://forum.tagdiv.com/cloudflare-cdn/

Hope this helps!
Thanks!

Thanks i can use it as RTL, just some trick to change in the theme panel; turn some sidebar from right to left and its done; you can check my website http://www.albanate.com, i just need to make float to left for some elements; but its ok; it work just perfect. My only issue is with Mobile theme, it need some adjustment you can check my website to see if you can give me some assistance please; the theme can work as RTL easily without adding anything to css. For the header i switch to center logo and it work fine, please can you help me to make it work with the mobile theme; i am preparing a tutorial on how to build an RTL website with newspaper; i just need your help with Mobile.

Thanks a lot

Hi

Try this css in theme panel > custom code > custom css to hide more from author: http://screencast.com/t/OI7Psa8fib

.td-related-right {
display: none!important;
}

You can use translations panel to change that texts as desired: http://screencast.com/t/wFouwbWPwtH

Hope this helps!
Thanks!

Hi Catalin,

Thanks for the speedy response.

What about just for the main menu? Is there not some custom css I could drop in to the custom code section?

Best,

Kes

HI @infusednz

You can also use this css in theme panel > custom code > custom css: http://screencast.com/t/6unFfh1f8XC

.dropcap {
background-color: red!important;
}

Hope this helps!
Thanks!

Hi

The theme set a 1068px width for content and this value can be changed easily. All theme’s blocks, modules and post/page templates relay on this value so if it’s changed all layout must be re-built.
You can try below css to add a border but is possible only like this: http://screencast.com/t/z8LeAiHTbo0h

.td-main-content-wrap .td-container {
width: 1070px;
border: 1px solid red;
}

For a different implementation you will need additional customizations. We can’t offer customization services at the moment so if you still need guidance on this or you’re not aware of the steps you need to take in this regard please consider hiring a developer or a freelancer to do this for you.

Thanks!

Hello,

Only codes I linked was in custom CSS, I removed it long time ago. I removed all plugins but I can’t see my background. I can’t really stay like that … Can you help me more… I buy the theme, I like it, I would like it work fine …

Thank you

Catalin,
Thank you for your reply. I’m not sure that I understand your comment concerning not being able to compare the two sites?
On my laptop and external monitor the http://newstest.meta-morphos.es/ home page looks the same when the mobile plugin is turned on or off. The only difference I see is when I view the site from my mobile phone. The mobile plugin reduces the front page to a vertical stack of scrolling blocks.

I’ve now removed all CSS fron the ‘newstest’ site and only have the Visual Composer and Slider Revolution plugins activated. The one customization is that I replaced the original top left column block with one Revolution slider block. One a large monitor the front page looks AOK and displays the same on Firefox and Chrome. When I view it on the mobile phone it almost displays correctly but the left margin is shifted left and crops off some of the text. The right column doesn’t display well.

It appears that one solution is to use it with this one customization and with the mobile plugin turned on. On mobile viewing it abbreviates the front page content but at least displays a usable vertical scrolling stack of info blocks.

Is it possible to turn off the Magazine themes default effort to transform the standard site into a responsive version?

That is, to have the complete site page (without mobile plugin) displayed on mobile screens and simply scaled down to fit the mobile or tablet window? I have this option with a framework theme and the mini display of the complete web page works fine. One simply zooms in to select the menu or view areas of the page.(Please see; http://www.kaufmanndesign.com)

This would provide a simple solution for several issues. The pages could still handle iframes, and there would be no surprises for any pages customized with CSS. If a page look good on a normal screen, then it would look fine on a mobile screen. Maybe this setting option is somewhere in the theme settings?

It’s a bit of a surprise that with 50+ Visual Composer elements and blocks as standard tools on the Newspaper theme that it’s not possible to shift a few around without breaking the theme. In the Magazine/Newspaper theme, is it primarily the first top left column block that’s critical to hold the page together as originally intended?

Thanks, Lon K