- NewspaperCreate Custom Code with the browser’s Inspector or the Live CSS Box
- NewspaperScroll Animation
- NewspaperWP Rocket and Newspaper Theme: Optimization Guide
- NewspaperHow to setup Twitch for Social Counter
- NewspaperModal Popup
- NewspaperFlex Block Settings Guide
- NewspaperAutoptimize Plugin – install and configuration
- NewspaperAdding Multiple Authors to Your Articles
- NewspaperDesign your Post Pages using the Cloud Library Templates
- NewspaperBig Grid Flex Settings
- NewsmagtagDiv Composer Tutorial
- TutorialsFrom WPBakery to tagDiv Composer
- NewspapertagDiv Composer Tutorial
- NewspaperTheme modules and blocks
- TutorialsDefault Block Settings Guide
- NewspaperThe Mobile Theme
- NewspaperCompare theme files – Winmerge tutorial
- NewsmagBlock settings tutorial
- NewsmagLogo & Favicon
- NewsmagFooter templates
Thank you Bettina.
In the composer we found two elements:
Extra CSS
Extended Shortcodes
What is the use of these and how to use them?
Dear forum,
we want to make our websites more accessible. One critical issue is the navigation by keyboard.
However, on my website https://s-quin-magazin.de/ nothing was highlighted when I navigated by keyboard. It seems the focus outlines were suppressed.
I added some custom css in the theme panel:
*:focus-visible {
outline: 1px solid white;
box-shadow: 0 0 0 2px #fff, 0 0 0 4px #4b5dcc;
}
Now the menu, categoriesa and images have a nice shadow box. But unfortunately the headlines of the texts are not highlighted.
How can I change that?
Thank you!
Gunnar
Hi Anamaria,
Disabling the tagdiv Standard pack plugin solves the problem and the css seems fine.
But I don’t understand if I have to re-enable the plugin now or not. What is it for?
Thank you
Hello!
Ah, ok. They are different elements with different styles. The posts loop has 100% width by default. So, you should add the width auto for the posts loop: https://app.screencast.com/FumD9C7wZSYv2
In the CSS there, you can simply add -10, not -10px.
Thank you!
Hello,
Please try to disable the tagdiv Standard pack plugin, disable the sticky menu, clear the unused css cache -> https://prnt.sc/tz-zU1wnLUEm and check if the issue persists.
Also, please provide a link to a page where this issue is with the CSS duplicate.
Thank you!
I did some debugging, and it seems that the CSS duplication problem is related to TagDiv Composer. Below is the CSS block (after disabling inline css aggregation). I manually added a comment in the middle of the code indicating where the CSS is duplicated.
<style>
/* custom css – generated by TagDiv Composer */
.td_module_wrap .td-image-wrap:before {
content: ”;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: url(https://www.mrw.it/wp-content/uploads/2024/08/no-thumb-300×188.png);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
z-index:-1
}
.td-page-title, .td-category-title-holder .td-page-title {
font-family:Chivo
}
.td-page-content h1, .wpb_text_column h1 {
font-family:Chivo
}
.td-page-content h2, .wpb_text_column h2 {
font-family:Chivo
}
.td-page-content h3, .wpb_text_column h3 {
font-family:Chivo
}
.td-page-content h4, .wpb_text_column h4 {
font-family:Chivo
}
.td-page-content h5, .wpb_text_column h5 {
font-family:Chivo
}
.td-page-content h6, .wpb_text_column h6 {
font-family: Chivo
}
.td-scroll-up[data-style=’style2′] .td-scroll-up-tooltip {
background-color: #384764
}
.td-scroll-up[data-style=’style2′] .td-scroll-up-tt-arrow, .td-scroll-up[data-style=’style2′] .td-scroll-up-arrow {
fill:#384764
}
.td-scroll-up-progress-circle path {
stroke:#384764
}
:root {
–td_excl_label: ‘ESCLUSIVO’;
–td_theme_color: #ff6600;
–td_slider_text: rgba(255, 102, 0, 0.7);
–td_mobile_gradient_one_mob: rgba(0, 0, 0, 0.8);
–td_mobile_gradient_two_mob: rgba(0, 0, 0, 0.9);
–td_mobile_text_active_color: rgba(255, 255, 255, 0.9);
–td_default_google_font_1: “Open Sans”;
–td_default_google_font_2: “Open Sans”;
–td_login_hover_background: #f4f4f4;
–td_login_gradient_one: rgba(0, 0, 0, 0.9);
–td_login_gradient_two:rgba(0, 0, 0, 0.8)
}
.td-header-style-12 .td-header-menu-wrap-full, .td-header-style-12 .td-affix, .td-grid-style-1.td-hover-1 .td-big-grid-post:hover .td-post-category, .td-grid-style-5.td-hover-1 .td-big-grid-post:hover .td-post-category, .td_category_template_3 .td-current-sub-category, .td_category_template_8 .td-category-header .td-category a.td-current-sub-category, .td_category_template_4 .td-category-siblings .td-category a:hover, .td_block_big_grid_9.td-grid-style-1 .td-post-category, .td_block_big_grid_9.td-grid-style-5 .td-post-category, .td-grid-style-6.td-hover-1 .td-module-thumb:after, .tdm-menu-active-style5 .td-header-menu-wrap .sf-menu > .current-menu-item > a, .tdm-menu-active-style5 .td-header-menu-wrap .sf-menu > .current-menu-ancestor > a, .tdm-menu-active-style5 .td-header-menu-wrap .sf-menu > .current-category-ancestor > a, .tdm-menu-active-style5 .td-header-menu-wrap .sf-menu > li > a:hover, .tdm-menu-active-style5 .td-header-menu-wrap .sf-menu > .sfHover > a {
background-color:#ff6600
}
.td_mega_menu_sub_cats .cur-sub-cat, .td-mega-span h3 a:hover, .td_mod_mega_menu:hover .entry-title a, .header-search-wrap .result-msg a:hover, .td-header-top-menu .td-drop-down-search .td_module_wrap:hover .entry-title a, .td-header-top-menu .td-icon-search:hover, .td-header-wrap .result-msg a:hover, .top-header-menu li a:hover, .top-header-menu .current-menu-item > a, .top-header-menu .current-menu-ancestor > a, .top-header-menu .current-category-ancestor > a, .td-social-icon-wrap > a:hover, .td-header-sp-top-widget .td-social-icon-wrap a:hover, .td_mod_related_posts:hover h3 > a, .td-post-template-11 .td-related-title .td-related-left:hover, .td-post-template-11 .td-related-title .td-related-right:hover, .td-post-template-11 .td-related-title .td-cur-simple-item, .td-post-template-11 .td_block_related_posts .td-next-prev-wrap a:hover, .td-category-header .td-pulldown-category-filter-link:hover, .td-category-siblings .td-subcat-dropdown a:hover, .td-category-siblings .td-subcat-dropdown a.td-current-sub-category, .footer-text-wrap .footer-email-wrap a, .footer-social-wrap a:hover, .td_module_17 .td-read-more a:hover, .td_module_18 .td-read-more a:hover, .td_module_19 .td-post-author-name a:hover, .td-pulldown-syle-2 .td-subcat-dropdown:hover .td-subcat-more span, .td-pulldown-syle-2 .td-subcat-dropdown:hover .td-subcat-more i, .td-pulldown-syle-3 .td-subcat-dropdown:hover .td-subcat-more span, .td-pulldown-syle-3 .td-subcat-dropdown:hover .td-subcat-more i, .tdm-menu-active-style3 .tdm-header.td-header-wrap .sf-menu > .current-category-ancestor > a, .tdm-menu-active-style3 .tdm-header.td-header-wrap .sf-menu > .current-menu-ancestor > a, .tdm-menu-active-style3 .tdm-header.td-header-wrap .sf-menu > .current-menu-item > a, .tdm-menu-active-style3 .tdm-header.td-header-wrap .sf-menu > .sfHover > a, .tdm-menu-active-style3 .tdm-header.td-header-wrap .sf-menu > li > a:hover {
color:#ff6600
}
.td-mega-menu-page .wpb_content_element ul li a:hover, .td-theme-wrap .td-aj-search-results .td_module_wrap:hover .entry-title a, .td-theme-wrap .header-search-wrap .result-msg a:hover {
color:#ff6600 !important
}
.td_category_template_8 .td-category-header .td-category a.td-current-sub-category, .td_category_template_4 .td-category-siblings .td-category a:hover, .tdm-menu-active-style4 .tdm-header .sf-menu > .current-menu-item > a, .tdm-menu-active-style4 .tdm-header .sf-menu > .current-menu-ancestor > a, .tdm-menu-active-style4 .tdm-header .sf-menu > .current-category-ancestor > a, .tdm-menu-active-style4 .tdm-header .sf-menu > li > a:hover, .tdm-menu-active-style4 .tdm-header .sf-menu > .sfHover > a {
border-color:#ff6600
}
.post .td-post-header .entry-title {
font-family:Chivo
}
.td-post-content h1 {
font-family: Chivo;
font-weight:bold
}
.td-post-content h2 {
font-family: Chivo;
font-weight:600
}
.td-post-content h3 {
font-family: Chivo;
font-weight:500
}
.td-post-content h4 {
font-family: Chivo;
font-weight:500
}
.td-post-content h5 {
font-family: Chivo;
font-weight:500
}
.td-post-content h6 {
font-family: Chivo;
font-weight:500
}
.tdm-menu-btn1 .tds-button1, .tdm-menu-btn1 .tds-button6:after {
background-color:#cc5200
}
.tdm-menu-btn1 .tds-button2:before, .tdm-menu-btn1 .tds-button6:before {
border-color:#cc5200
}
.tdm-menu-btn1 .tds-button2, .tdm-menu-btn1 .tds-button2 i {
color:#cc5200
}
.tdm-menu-btn1 .tds-button3 {
-webkit-box-shadow: 0 2px 16px #cc5200;
-moz-box-shadow: 0 2px 16px #cc5200;
box-shadow:0 2px 16px #cc5200
}
.tdm-menu-btn1 .tds-button3:hover {
-webkit-box-shadow: 0 4px 26px #cc5200;
-moz-box-shadow: 0 4px 26px #cc5200;
box-shadow:0 4px 26px #cc5200
}
.tdm-menu-btn1 .tds-button7 .tdm-btn-border-top, .tdm-menu-btn1 .tds-button7 .tdm-btn-border-bottom {
background-color:#cc5200
}
.tdm-menu-btn1 .tds-button8 {
background:#cc5200
}
.tdm-menu-btn1 .tds-button1:before, .tdm-menu-btn1 .tds-button4 .tdm-button-b {
background-color:#ff6600
}
.tdm-menu-btn1 .tds-button2:hover:before, .tdm-menu-btn1 .tds-button6:hover:before {
border-color:#ff6600
}
.tdm-menu-btn1 .tdm-btn-style:hover {
color:#ff6600
}
.tdm-menu-btn1 .tds-button3:hover {
-webkit-box-shadow: 0 4px 26px #ff6600;
-moz-box-shadow: 0 4px 26px #ff6600;
box-shadow:0 4px 26px #ff6600
}
.tdm-menu-btn1 .tds-button7:hover .tdm-btn-border-top, .tdm-menu-btn1 .tds-button7:hover .tdm-btn-border-bottom {
background-color:#ff6600
}
.tdm-menu-btn1 .tds-button8:before {
background-color:#ff6600
}
.tdm-menu-btn2 .tds-button1, .tdm-menu-btn2 .tds-button6:after {
background-color:#384764
}
.tdm-menu-btn2 .tds-button2:before, .tdm-menu-btn2 .tds-button6:before {
border-color:#384764
}
.tdm-menu-btn2 .tds-button2, .tdm-menu-btn2 .tds-button2 i {
color:#384764
}
.tdm-menu-btn2 .tds-button3 {
-webkit-box-shadow: 0 2px 16px #384764;
-moz-box-shadow: 0 2px 16px #384764;
box-shadow:0 2px 16px #384764
}
.tdm-menu-btn2 .tds-button3:hover {
-webkit-box-shadow: 0 4px 26px #384764;
-moz-box-shadow: 0 4px 26px #384764;
box-shadow:0 4px 26px #384764
}
.tdm-menu-btn2 .tds-button7 .tdm-btn-border-top, .tdm-menu-btn2 .tds-button7 .tdm-btn-border-bottom {
background-color:#384764
}
.tdm-menu-btn2 .tds-button8 {
background:#384764
}
.tdm-menu-btn2 .tds-button1:before, .tdm-menu-btn2 .tds-button4 .tdm-button-b {
background-color:#336699
}
.tdm-menu-btn2 .tds-button2:hover:before, .tdm-menu-btn2 .tds-button6:hover:before {
border-color:#336699
}
.tdm-menu-btn2 .tdm-btn-style:hover {
color:#ff6600
}
.tdm-menu-btn2 .tds-button3:hover {
-webkit-box-shadow: 0 4px 26px #336699;
-moz-box-shadow: 0 4px 26px #336699;
box-shadow:0 4px 26px #336699
}
.tdm-menu-btn2 .tds-button7:hover .tdm-btn-border-top, .tdm-menu-btn2 .tds-button7:hover .tdm-btn-border-bottom {
background-color:#336699
}
.tdm-menu-btn2 .tds-button8:before {
background-color: #336699
}
/**
* The rest of the CSS is a duplicate
*/
.td_module_wrap .td-image-wrap:before {
content: ”;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: url(https://www.mrw.it/wp-content/uploads/2024/08/no-thumb-300×188.png);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
z-index:-1
}
.td-page-title, .td-category-title-holder .td-page-title {
font-family:Chivo
}
.td-page-content h1, .wpb_text_column h1 {
font-family:Chivo
}
.td-page-content h2, .wpb_text_column h2 {
font-family:Chivo
}
.td-page-content h3, .wpb_text_column h3 {
font-family:Chivo
}
.td-page-content h4, .wpb_text_column h4 {
font-family:Chivo
}
.td-page-content h5, .wpb_text_column h5 {
font-family:Chivo
}
.td-page-content h6, .wpb_text_column h6 {
font-family: Chivo
}
.td-scroll-up[data-style=’style2′] .td-scroll-up-tooltip {
background-color: #384764
}
.td-scroll-up[data-style=’style2′] .td-scroll-up-tt-arrow, .td-scroll-up[data-style=’style2′] .td-scroll-up-arrow {
fill:#384764
}
.td-scroll-up-progress-circle path {
stroke:#384764
}
:root {
–td_excl_label: ‘ESCLUSIVO’;
–td_theme_color: #ff6600;
–td_slider_text: rgba(255, 102, 0, 0.7);
–td_mobile_gradient_one_mob: rgba(0, 0, 0, 0.8);
–td_mobile_gradient_two_mob: rgba(0, 0, 0, 0.9);
–td_mobile_text_active_color: rgba(255, 255, 255, 0.9);
–td_default_google_font_1: “Open Sans”;
–td_default_google_font_2: “Open Sans”;
–td_login_hover_background: #f4f4f4;
–td_login_gradient_one: rgba(0, 0, 0, 0.9);
–td_login_gradient_two:rgba(0, 0, 0, 0.8)
}
.td-header-style-12 .td-header-menu-wrap-full, .td-header-style-12 .td-affix, .td-grid-style-1.td-hover-1 .td-big-grid-post:hover .td-post-category, .td-grid-style-5.td-hover-1 .td-big-grid-post:hover .td-post-category, .td_category_template_3 .td-current-sub-category, .td_category_template_8 .td-category-header .td-category a.td-current-sub-category, .td_category_template_4 .td-category-siblings .td-category a:hover, .td_block_big_grid_9.td-grid-style-1 .td-post-category, .td_block_big_grid_9.td-grid-style-5 .td-post-category, .td-grid-style-6.td-hover-1 .td-module-thumb:after, .tdm-menu-active-style5 .td-header-menu-wrap .sf-menu > .current-menu-item > a, .tdm-menu-active-style5 .td-header-menu-wrap .sf-menu > .current-menu-ancestor > a, .tdm-menu-active-style5 .td-header-menu-wrap .sf-menu > .current-category-ancestor > a, .tdm-menu-active-style5 .td-header-menu-wrap .sf-menu > li > a:hover, .tdm-menu-active-style5 .td-header-menu-wrap .sf-menu > .sfHover > a {
background-color:#ff6600
}
.td_mega_menu_sub_cats .cur-sub-cat, .td-mega-span h3 a:hover, .td_mod_mega_menu:hover .entry-title a, .header-search-wrap .result-msg a:hover, .td-header-top-menu .td-drop-down-search .td_module_wrap:hover .entry-title a, .td-header-top-menu .td-icon-search:hover, .td-header-wrap .result-msg a:hover, .top-header-menu li a:hover, .top-header-menu .current-menu-item > a, .top-header-menu .current-menu-ancestor > a, .top-header-menu .current-category-ancestor > a, .td-social-icon-wrap > a:hover, .td-header-sp-top-widget .td-social-icon-wrap a:hover, .td_mod_related_posts:hover h3 > a, .td-post-template-11 .td-related-title .td-related-left:hover, .td-post-template-11 .td-related-title .td-related-right:hover, .td-post-template-11 .td-related-title .td-cur-simple-item, .td-post-template-11 .td_block_related_posts .td-next-prev-wrap a:hover, .td-category-header .td-pulldown-category-filter-link:hover, .td-category-siblings .td-subcat-dropdown a:hover, .td-category-siblings .td-subcat-dropdown a.td-current-sub-category, .footer-text-wrap .footer-email-wrap a, .footer-social-wrap a:hover, .td_module_17 .td-read-more a:hover, .td_module_18 .td-read-more a:hover, .td_module_19 .td-post-author-name a:hover, .td-pulldown-syle-2 .td-subcat-dropdown:hover .td-subcat-more span, .td-pulldown-syle-2 .td-subcat-dropdown:hover .td-subcat-more i, .td-pulldown-syle-3 .td-subcat-dropdown:hover .td-subcat-more span, .td-pulldown-syle-3 .td-subcat-dropdown:hover .td-subcat-more i, .tdm-menu-active-style3 .tdm-header.td-header-wrap .sf-menu > .current-category-ancestor > a, .tdm-menu-active-style3 .tdm-header.td-header-wrap .sf-menu > .current-menu-ancestor > a, .tdm-menu-active-style3 .tdm-header.td-header-wrap .sf-menu > .current-menu-item > a, .tdm-menu-active-style3 .tdm-header.td-header-wrap .sf-menu > .sfHover > a, .tdm-menu-active-style3 .tdm-header.td-header-wrap .sf-menu > li > a:hover {
color:#ff6600
}
.td-mega-menu-page .wpb_content_element ul li a:hover, .td-theme-wrap .td-aj-search-results .td_module_wrap:hover .entry-title a, .td-theme-wrap .header-search-wrap .result-msg a:hover {
color:#ff6600 !important
}
.td_category_template_8 .td-category-header .td-category a.td-current-sub-category, .td_category_template_4 .td-category-siblings .td-category a:hover, .tdm-menu-active-style4 .tdm-header .sf-menu > .current-menu-item > a, .tdm-menu-active-style4 .tdm-header .sf-menu > .current-menu-ancestor > a, .tdm-menu-active-style4 .tdm-header .sf-menu > .current-category-ancestor > a, .tdm-menu-active-style4 .tdm-header .sf-menu > li > a:hover, .tdm-menu-active-style4 .tdm-header .sf-menu > .sfHover > a {
border-color:#ff6600
}
.post .td-post-header .entry-title {
font-family:Chivo
}
.td-post-content h1 {
font-family: Chivo;
font-weight:bold
}
.td-post-content h2 {
font-family: Chivo;
font-weight:600
}
.td-post-content h3 {
font-family: Chivo;
font-weight:500
}
.td-post-content h4 {
font-family: Chivo;
font-weight:500
}
.td-post-content h5 {
font-family: Chivo;
font-weight:500
}
.td-post-content h6 {
font-family: Chivo;
font-weight:500
}
.tdm-menu-btn1 .tds-button1, .tdm-menu-btn1 .tds-button6:after {
background-color:#cc5200
}
.tdm-menu-btn1 .tds-button2:before, .tdm-menu-btn1 .tds-button6:before {
border-color:#cc5200
}
.tdm-menu-btn1 .tds-button2, .tdm-menu-btn1 .tds-button2 i {
color:#cc5200
}
.tdm-menu-btn1 .tds-button3 {
-webkit-box-shadow: 0 2px 16px #cc5200;
-moz-box-shadow: 0 2px 16px #cc5200;
box-shadow:0 2px 16px #cc5200
}
.tdm-menu-btn1 .tds-button3:hover {
-webkit-box-shadow: 0 4px 26px #cc5200;
-moz-box-shadow: 0 4px 26px #cc5200;
box-shadow:0 4px 26px #cc5200
}
.tdm-menu-btn1 .tds-button7 .tdm-btn-border-top, .tdm-menu-btn1 .tds-button7 .tdm-btn-border-bottom {
background-color:#cc5200
}
.tdm-menu-btn1 .tds-button8 {
background:#cc5200
}
.tdm-menu-btn1 .tds-button1:before, .tdm-menu-btn1 .tds-button4 .tdm-button-b {
background-color:#ff6600
}
.tdm-menu-btn1 .tds-button2:hover:before, .tdm-menu-btn1 .tds-button6:hover:before {
border-color:#ff6600
}
.tdm-menu-btn1 .tdm-btn-style:hover {
color:#ff6600
}
.tdm-menu-btn1 .tds-button3:hover {
-webkit-box-shadow: 0 4px 26px #ff6600;
-moz-box-shadow: 0 4px 26px #ff6600;
box-shadow:0 4px 26px #ff6600
}
.tdm-menu-btn1 .tds-button7:hover .tdm-btn-border-top, .tdm-menu-btn1 .tds-button7:hover .tdm-btn-border-bottom {
background-color:#ff6600
}
.tdm-menu-btn1 .tds-button8:before {
background-color:#ff6600
}
.tdm-menu-btn2 .tds-button1, .tdm-menu-btn2 .tds-button6:after {
background-color:#384764
}
.tdm-menu-btn2 .tds-button2:before, .tdm-menu-btn2 .tds-button6:before {
border-color:#384764
}
.tdm-menu-btn2 .tds-button2, .tdm-menu-btn2 .tds-button2 i {
color:#384764
}
.tdm-menu-btn2 .tds-button3 {
-webkit-box-shadow: 0 2px 16px #384764;
-moz-box-shadow: 0 2px 16px #384764;
box-shadow:0 2px 16px #384764
}
.tdm-menu-btn2 .tds-button3:hover {
-webkit-box-shadow: 0 4px 26px #384764;
-moz-box-shadow: 0 4px 26px #384764;
box-shadow:0 4px 26px #384764
}
.tdm-menu-btn2 .tds-button7 .tdm-btn-border-top, .tdm-menu-btn2 .tds-button7 .tdm-btn-border-bottom {
background-color:#384764
}
.tdm-menu-btn2 .tds-button8 {
background:#384764
}
.tdm-menu-btn2 .tds-button1:before, .tdm-menu-btn2 .tds-button4 .tdm-button-b {
background-color:#336699
}
.tdm-menu-btn2 .tds-button2:hover:before, .tdm-menu-btn2 .tds-button6:hover:before {
border-color:#336699
}
.tdm-menu-btn2 .tdm-btn-style:hover {
color:#ff6600
}
.tdm-menu-btn2 .tds-button3:hover {
-webkit-box-shadow: 0 4px 26px #336699;
-moz-box-shadow: 0 4px 26px #336699;
box-shadow:0 4px 26px #336699
}
.tdm-menu-btn2 .tds-button7:hover .tdm-btn-border-top, .tdm-menu-btn2 .tds-button7:hover .tdm-btn-border-bottom {
background-color:#336699
}
.tdm-menu-btn2 .tds-button8:before {
background-color: #336699
}
</style>
CSS variables are also declared twice in the page
:root {
–td_excl_label: ‘ESCLUSIVO’;
–td_theme_color: #ff6600;
–td_slider_text: rgba(255, 102, 0, 0.7);
–td_mobile_gradient_one_mob: rgba(0, 0, 0, 0.8);
–td_mobile_gradient_two_mob: rgba(0, 0, 0, 0.9);
–td_mobile_text_active_color: rgba(255, 255, 255, 0.9);
–td_default_google_font_1: “Open Sans”;
–td_default_google_font_2: “Open Sans”;
–td_login_hover_background: #f4f4f4;
–td_login_gradient_one: rgba(0, 0, 0, 0.9);
–td_login_gradient_two:rgba(0, 0, 0, 0.8)
}
In the “td-inline-css-aggregated” block there are a lot of duplicate CSS declarations.
For example in this page:
https://www.mrw.it/trovare-font-immagine/?nowprocket
Search in the source the string:
body, p { font-family: “Open Sans” }
.td-scroll-up[data-style=’style2′] .td-scroll-up-tooltip { background-color: #384764 }
It’s just an example.
Through a tool I was able to verify that there are more than 100 duplicate declarations on this page.
The duplicated css code seems really a lot. It’s true that it loads later but the weight of the page increases significantly.
Why does this happen?
Updated to v12.7 and now I cannot reduce the “Job title text” line height in the Testimonial shortcode to anything less than what you see in the linked image. I can increase it to an even greater (unacceptable) height but not lessen it. Had full control and looked good before update. Can’t seem to force it to an acceptable height even with CSS. Please help!
Hello!
You can change those gaps from the CSS tab of the flex block element and set 10 as you wish in the mobile viewport: https://app.screencast.com/kwRzG1ybPwtHv. Those values are responsive and can be changed easily on each viewport from the Tagdiv Composer desktop, tablet landscape/portrait, and mobile.
Thank you!
Hello!
Click on the row and check the row’s CSS tab: https://app.screencast.com/mVusXjsq6Sdmo (stretch row and 1200x content)
We have some settings for the rows and different stretch sizes: https://www.screencast.com/t/bsbB5P97A
Thank you!
Hello!
This site https://dev.webacersoftware.com is unavailable, and I can’t see it anymore.
You seem to use the Momentum demo, so please note that this demo used raw CSS code.
Try to use this plugin: https://duplicator.com/how-to-migrate-wordpress-site/
Thank you!
Hello,
You need to go to select the header menu zone and in the tab CSS delete the margin bottom -> https://i.imgur.com/H7Jh6C7.jpeg -> https://we.tl/t-hvP7ccff98
Thank you!
Hello!
It works only with the accent color. A workaround there could be to add some CSS code: https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/
Thank you for understanding!
Hey there!
There’s an issue while using Newspaper Theme with tagdiv composer.
I have a problem with the color of my SVG logo in the header working with tagdiv composer.
My SVG file has two colors, but on Website it is only one color.
I exported SVG file from Adobe Illstrator, opened file in notepad++ for getting the code and added it to tagdivcomposer.
So far, everything works fine.
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 29.3.1, SVG Export Plug-In . SVG Version: 9.03 Build 55982) -->
<svg version="1.1" id="PharmaNow" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 634.96 130.39" style="enable-background:new 0 0 634.96 130.39;" xml:space="preserve">
<style type="text/css">
.st0{fill:#1D1D1B;}
.st1{fill:#E20613;}
</style>
<g id="Now__x2F__x2F__x2F_">
<path class="st0" d="M486.59,63.86c-2.25-2.22-4.98-3.96-8.11-5.18c-3.13-1.22-6.57-1.85-10.24-1.85c-3.67,0-7.11,0.62-10.24,1.85
c-3.13,1.22-5.86,2.97-8.11,5.18c-2.25,2.22-4.05,4.89-5.33,7.95c-1.29,3.06-1.95,6.51-1.95,10.25c0,3.74,0.66,7.19,1.95,10.25
c1.29,3.06,3.09,5.74,5.34,7.95c2.25,2.21,4.98,3.96,8.11,5.18c3.13,1.22,6.57,1.84,10.24,1.84c3.67,0,7.11-0.62,10.24-1.84
c3.13-1.23,5.86-2.97,8.11-5.18c2.25-2.21,4.04-4.89,5.34-7.95c1.29-3.07,1.95-6.51,1.95-10.25c0-3.73-0.66-7.18-1.95-10.25
C490.63,68.75,488.84,66.08,486.59,63.86z M468.24,99.23c-2.49,0-4.76-0.45-6.76-1.33c-2-0.88-3.74-2.11-5.17-3.64
c-1.44-1.53-2.55-3.36-3.3-5.42c-0.75-2.06-1.14-4.35-1.14-6.78c0-2.43,0.38-4.72,1.14-6.78c0.75-2.06,1.86-3.88,3.3-5.42
c1.44-1.53,3.18-2.76,5.17-3.64c1.99-0.88,4.27-1.33,6.76-1.33c2.49,0,4.76,0.45,6.76,1.33c2,0.88,3.74,2.11,5.17,3.64
c1.44,1.54,2.55,3.36,3.3,5.42c0.76,2.07,1.14,4.35,1.14,6.78c0,2.43-0.38,4.71-1.14,6.78c-0.75,2.06-1.86,3.88-3.3,5.42
c-1.44,1.53-3.18,2.76-5.17,3.64C473,98.78,470.73,99.23,468.24,99.23z"/>
<polygon class="st0" points="558.38,58.04 547.85,93.8 535.64,58.04 526.8,58.04 514.78,93.8 504.15,58.04 494.63,58.04
510.23,106.08 518.88,106.08 530.63,70.25 543.87,106.08 552.2,106.08 567.7,58.04 "/>
<polygon class="st1" points="577.78,58.04 562.28,106.08 570.88,106.08 586.38,58.04 "/>
<polygon class="st1" points="596.46,58.04 580.96,106.08 589.56,106.08 605.06,58.04 "/>
<polygon class="st1" points="615.14,58.04 599.64,106.08 608.24,106.08 623.74,58.04 "/>
<polygon class="st0" points="422,93.8 409.79,58.04 400.95,58.04 383.9,105.55 383.71,106.08 393.03,106.08 404.78,70.25
418.02,106.08 426.35,106.08 441.85,58.04 432.53,58.04 "/>
</g>
<g id="Pharma">
<path class="st1" d="M110.12,34.57v29.98h0.2c1.78-4.65,7.31-7.71,13.44-7.71c12.85,0,17.79,7.12,17.79,22.24v26.98h-14.82V81.65
c0-8.99-2.67-11.76-7.71-11.76c-5.93,0-8.9,3.56-8.9,11.76v24.41H95.3V34.57H110.12z"/>
<path class="st1" d="M195.8,80.96v25.1h-13.64v-6.03h-0.2c-3.26,5.14-9.29,7.21-15.22,7.21c-8.89,0-17.1-5.14-17.1-14.82
c0-16.8,20.75-16.9,32.52-16.9c0-5.44-4.55-8.6-9.49-8.6c-4.84,0-8.89,2.17-12.06,5.73l-7.91-8.1c5.53-5.34,13.64-7.71,21.15-7.71
C190.47,56.84,195.8,65.04,195.8,80.96z M171,97.16c5.63,0,11.17-2.97,11.17-9.09v-3.06h-4.45c-4.45,0-13.84,0.69-13.84,6.92
C163.88,95.68,167.83,97.16,171,97.16z"/>
<path class="st1" d="M238.89,57.33v13.54c-2.17-0.59-4.05-0.99-6.33-0.99c-10.57,0-12.65,5.63-12.65,15.52v20.66h-14.82V58.03
h14.82v7.71h0.2c3.16-5.83,7.31-8.89,13.94-8.89C235.63,56.84,237.51,56.94,238.89,57.33z"/>
<path class="st1" d="M290.38,65.44c3.46-6.13,8.1-8.6,15.22-8.6c11.46,0,17,7.31,17,20.36v28.86h-14.82V77.89
c0-4.94-2.17-8.01-6.52-8.01c-6.13,0-8.99,4.05-8.99,10.48v25.7h-14.82V79.77c0-7.31-2.37-9.88-6.62-9.88
c-5.93,0-8.9,3.36-8.9,11.76v24.41h-14.82V58.03h14.23v6.52h0.2c2.67-4.84,8.01-7.71,14.03-7.71
C282.37,56.84,287.71,59.61,290.38,65.44z"/>
<path class="st1" d="M376.85,80.96v25.1h-13.64v-6.03h-0.2c-3.26,5.14-9.29,7.21-15.22,7.21c-8.89,0-17.1-5.14-17.1-14.82
c0-16.8,20.75-16.9,32.52-16.9c0-5.44-4.55-8.6-9.49-8.6c-4.84,0-8.89,2.17-12.06,5.73l-7.91-8.1c5.54-5.34,13.64-7.71,21.15-7.71
C371.52,56.84,376.85,65.04,376.85,80.96z M352.05,97.16c5.63,0,11.17-2.97,11.17-9.09v-3.06h-4.45c-4.45,0-13.84,0.69-13.84,6.92
C344.93,95.68,348.88,97.16,352.05,97.16z"/>
<g>
<g>
<path class="st1" d="M60.95,35.98H49.87H35.43v12.8v16.81c-10.57,1.2-22.57,5.54-22.57,19.76c0,13.15,11.21,14.95,11.21,25.26
c0,5.6-3.06,8.96-4.71,10.37c-0.26,0.22-0.05,0.64,0.28,0.57c3.05-0.67,10.87-3.98,10.87-14.74c0-8.38-6.77-10.44-6.77-19.01
c0-6.42,4.27-8.72,11.68-9.43c3.97-0.38,8.84-0.31,14.44-0.17c3.47,0.09,7.21,0.2,11.2,0.25c15.92,0.19,25.99-6.36,25.99-21.2
C87.07,42.81,77.77,35.98,60.95,35.98z M60.46,65.66c-4.25,0.06-6.8-0.18-10.59-0.35V49.06c4.64,0.01,8.31-0.02,8.31-0.02
c8.7,0,14.23,1.83,14.23,8.14C72.41,63.17,66.74,65.56,60.46,65.66z"/>
</g>
<g>
<path class="st1" d="M42.42,78.09c-0.37,0-0.73,0-1.09,0.01C41.69,78.09,42.05,78.09,42.42,78.09z"/>
<path class="st1" d="M47.3,78.14c0.2,0,0.4,0.01,0.61,0.01C47.71,78.15,47.51,78.14,47.3,78.14z"/>
<path class="st1" d="M43.42,78.09c0.24,0,0.48,0,0.73,0C43.9,78.09,43.66,78.09,43.42,78.09z"/>
<path class="st1" d="M45.3,78.1c0.23,0,0.46,0.01,0.7,0.01C45.76,78.11,45.53,78.11,45.3,78.1z"/>
<path class="st1" d="M39.47,78.13c0.35-0.01,0.71-0.02,1.07-0.03C40.17,78.11,39.82,78.12,39.47,78.13z"/>
<path class="st1" d="M35.43,78.36c0.52-0.05,1.06-0.09,1.61-0.13C36.49,78.27,35.95,78.31,35.43,78.36z"/>
<path class="st1" d="M49.82,80.32c-2.34-0.06-4.81-0.11-7.11-0.11c-2.9,0-5.15,0.09-7.07,0.27l-0.2,0.02v25.52h14.44V80.32
L49.82,80.32z"/>
<path class="st1" d="M37.63,78.21c0.37-0.02,0.74-0.04,1.12-0.05C38.36,78.17,37.99,78.19,37.63,78.21z"/>
</g>
<path class="st1" d="M33.31,48.58L33.31,48.58l0-12.65c-7.04-0.49-9.5-5.47-9.5-9.27c0-4,3.51-7.46,9.41-7.46
c4.09,0,8.13,2.55,9.85,3.36c1.95,0.93,3.84,2.34,7.92,1.95c3.63-0.34,6.95-1.4,9.84-2.8c1.89-0.91,2.51-1.75,2.69-3.05
c2.52,0.14,5.35,0.87,6.88,3.33c0.33,0.53,0.99,0.14,0.74-0.37c-0.94-1.95-2.46-2.94-4.17-3.66c-0.19-0.08-0.28-0.26-0.27-0.43
c-0.01-0.17,0.08-0.35,0.27-0.43c1.71-0.72,3.23-1.71,4.17-3.66c0.25-0.52-0.41-0.9-0.74-0.37c-1.53,2.46-4.36,3.2-6.88,3.33
c-0.19-1.27-0.82-2.1-2.68-3c-2.9-1.4-6.21-2.46-9.84-2.8c-4.08-0.39-5.7,1.23-7.86,1.23c-3.63,0-6.45-2.52-14.01-2.52
c-6.48,0-17.9,4.98-17.9,18.96C11.22,43.77,24.67,47.59,33.31,48.58z"/>
</g>
</g>
</svg>
When inserting to header, at first it has two colors (RGB: #e20613 and #000000), but after saving it apperas only in one Color (#e20613).
I also tryed to edit the SVG colors in tagdivcomposer > header logo style, but this does’t change anysthing.
I hope you can help me out with my problem!
Kind regards,
Melanie
Hi,
You could hide it with some CSS. Please try this code:
.td-page-title {
visibility: hidden;
}
The code will apply yo the whole website. If you want it just for the homepage, try it like this:
.home .td-page-title {
visibility: hidden;
}
Then the title should be hidden https://prnt.sc/rWkcvFXpM8xa
Thank you!
Hello Alex!
You can also use some CSS code if you want the same color for most links.
Thank you!
Hello,
Please block /wp-json/tdw/save_css
If an attacker wants to target this URL /wp-json/tdw/save_css they can do so. Even if the website uses a different theme, the attacker can still try that URL. We could add an option to be able to enable/disable the Live CSS, it will be considered. But for now in order to remove it this can only be done with a modification to the composer plugin. I think that all that removing it requires is to comment this line of code – https://prnt.sc/RtwvL5Nc4ikR -> https://prnt.sc/ymZmhdUfp57U But as I mentioned, the attacker can still try to access the URL.
Thank you!
A security plugin notified me that (“/wp-json/tdw/save_css”) was requested/viewed by a blocked IP.
Everything is up to date, the only thing I could find is on WPscan as a previously fixed issue in tagDiv Composer.
Hello!
Yes, you can add the form as a shortcode with column text and style it via CSS: https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/
Or you can add a form using our theme’s feature: https://forum.tagdiv.com/create-frontend-submission-form/
Thank you!
Hello!
Sure, you can customize the ad box shortcode in each viewport https://app.screencast.com/39By7mcHERvAl
The CSS tab of the ad box element contains the option Display: Show/Hidden and the options for width and height sizes.
Thank you!
Hello!
For the gradient, you can choose multiple colors there, for example: https://app.screencast.com/K3iMyxvMGpoEN
You can also add a class on the element and add some CSS code: https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/
Thank you!
Hi,
I’m currently working on a layout using tagDiv Composer and I’m running into a limitation with the background gradient options for rows.
Here’s what I’m trying to achieve:
I want to create a vertical gradient that starts with black, and stays solid black up to 70% of the row height. Then, from there, it should fade smoothly into white towards the bottom (100%).
In CSS terms, I’d normally do something like this:
background: linear-gradient(to bottom, black 0%, black 70%, white 100%);
But in tagDiv Composer, when I add a background gradient to a row, I can only:
– Select two colors
– Define the gradient direction/angle
There seems to be no option to control color stops or percentages of where the transition happens.
At the moment, it just fades evenly from one color to the other across the entire row.
Hello!
1. Unfortunately, the shortcode works only with 2 options that are still available now.
You can try to use a raw HTML shortcode, add the code and style it via CSS.
2. Unfortunately, you can not achieve this with our theme. You can only export the emails and use an external service.
3. Which one you want to use? For example, check these demos: https://demo.tagdiv.com/newspaper_real_estate_pro/
https://demo.tagdiv.com/newspaper_app_find_pro/
Thank you!