Search Results for 'browser inspector'

    No search results were found in Documentation!

Results from the Forum
Simion C.
tagDiv Staff

Hi,

Glad it works. I used the browser inspector to see the actual links, it is a useful tool
https://www.screencast.com/t/SajT8g1Pfeb
This is a guide if you would like to know more about using it
https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/

Thanks

Simion C.
tagDiv Staff

Hi,

That arrow can be removed with CSS. To make the code more precise you could use the menu item unique ID (each menu item has an ID), like in this example
https://www.screencast.com/t/xVb1yskH
I don’t see the menu at the moment on your website, but you can use a code like that to hide the arrow, using the menu item ID.

.menu-item-18056 .fa + .td-icon-menu-down {
display: none;
}

Please let me know if there is a problem with this solution, or you need further help.
This is a useful guide explaining how you can create custom code, by identifying the elements on the page and their classes with the browser inspector, a very powerful tool
https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/

Thanks

Catalin
tagDiv Staff

Hello leapdsc,

Sorry for this but please notice that what you want involves additional customizations and we cannot provide this type of services at the moment, sorry! Try to adjust it yourself, using the Inspector browser and create your own custom CSS code, according to the useful manual here -> https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/
Notice that we can only point you in the right direction and we cannot do that for you, sorry!

Hope this helps!

Thanks for your understanding!

Simion C.
tagDiv Staff

Hi,

Those parameters of the server and WordPress are imperative factors in the functionality of the theme and plugins. They are general WordPress configuration elements. Please follow the guide provided above and see if everything is set properly.
Ask your hosting provider to make the changes for you, as they might have a recommended method in this matter.
If there is still a problem, please deactivate all plugins except theme plugins and clear any installed cache. Then check in the theme panel while saving settings, if there are any errors in the browser console. Press F12 to bring up the inspector window and then open the console tab
https://www.screencast.com/t/ENQ5a8CB8
Check if there are any errors in this console. The admin ajax process could be blocked by the server, because of the multiple requests that it makes. In this case you can contact the hosting provider and explain this situation or provide a screenshot with the error.
They should be able to fix it if this is happening.
Please let us know the results.

Thanks

Simion C.
tagDiv Staff

Hi,

On block modules the category tag color could only be changed wit CSS code, if that is what you want. The custom colors set in the theme panel for these, will only be displayed in the post page.
You could change the default color with some CSS code by block, like this
https://www.screencast.com/t/0bmgFjkZ

This is the code used in the example

.td_block_big_grid_3 .td-post-category {
background-color: blue;
}

Use the browser inspector to identify the elements on the page and their classes, in order to create custom code
https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/

Thanks

Catalin
tagDiv Staff

Hello sebenar,

What exactly do you want to change to the social icons for the mobile menu? If you want to make some changes for the mobile menu, you should edit this container -> https://www.screencast.com/t/PaenSPuYG1 You have to provide more details for your desired changes. To create your own code, please check here -> https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/

Hope this helps!

Thanks for your understiading!

Simion C.
tagDiv Staff

Hi,

The easiest way would be to hide these elements with CSS on the posts you mention. You can use the post unique ID and create a code to remove the sharing and also related articles just for those posts. Like in this example
https://www.screencast.com/t/ux94lD9ks6
https://www.screencast.com/t/IszaczKLlZYH
https://www.screencast.com/t/TXwtMUPfB4
Use the post Ids you want in the code, and it will remove the sharing and related articles only in them. Enter the code in Theme panel->Custom CSS section

.postid-18093 .td-post-sharing,
.postid-18093 .td_block_related_posts {
display: none;
}

The post Id can be found either with the browser inspector for example, or in the WordPress posts edit screen
https://www.screencast.com/t/n7hX9419
There are also other ways.

Thanks

Simion C.
tagDiv Staff

Hi,

Changing the line height will increase the height of these elements if that is what you want to do. It could be done with CSS if you would like a value higher then available in the theme panel font settings. For example like this for the top menu
https://www.screencast.com/t/uwgYz8rX8n

.td-header-sp-top-menu,
.td-header-sp-top-widget {
line-height: 200px;
}

You can inspect the elements on the page and the classes used and their styles, in order to create custom code
https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/

Thanks

Bogdan B.
tagDiv Staff

Hi,

Usually there should be a space up there because the theme has spacing between elements by default. You can see this on our demo here: https://demo.tagdiv.com/newspaper/
Please check your custom code or plugins that can alter the css. Or maybe a particular style added to that block in the sidebar. It is hard to say if I cannot inspect the element with the browser inspector.
Try to first check custom code, plugins and css added for the block.

Thanks.

Simion C.
tagDiv Staff

Hi,

You can inspect the list you mention with the browser inspector and see how it is made
https://www.screencast.com/t/Q7FWdW5nrQ
https://www.screencast.com/t/BwasffptT
Then adapt the style to the theme smart list elements, something like this for smart list style 2 for example
https://www.screencast.com/t/b6iVdsbpxc
This is a tutorial about using the browser inspect to identify elements on pages and the styles used, to create custom code
https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/
Also this is the code I used in the example if it should be helpful to you

.td-sml-current-item-nr {
position: absolute;
top: -45px;
left: -42px;
width: 90px;
height: 90px;
line-height: 85px;
border-radius: 50%;
border: solid .3em #2D9EDD;
box-shadow: 0 2px 10px rgba(30,30,30,.2);
background-color: #fff;
text-align: center;
color:rgb(45, 158, 221);
}
.td-item {
border: 1px solid #ddd;
}

Thanks

Catalin
tagDiv Staff

Hello temia69,

If you want to hide some elements from your modules, notice that you should target it with custom CSS code, using the Inspector browser, according to our documentation here
-> https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/ Notice that if you will check the theme panel, you will see that exists an option in the theme which allows you to turn off the meta information for modules on blocks, like this -> https://www.screencast.com/t/XqWgf591Mp5

Hope this helps!

Thanks for your understanding!

Simion C.
tagDiv Staff

Hi,

The browser inspector tool is a powerful tool that can be used to inspect the page and see the classes used. This is a useful guide for this purpose
https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/

1. That gradient on the slide could changed with a code like this
https://www.screencast.com/t/Bp9jkwGdR
Use the colors you want in the code, then enter it in Theme panel->Custom CSS section

.td_block_slide .td-image-gradient:before {
background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(25, 85, 199, 0.8) 100%);
}

2. The subtitle will be displayed on the post page
https://www.screencast.com/t/1hg237kqz
https://www.screencast.com/t/K2sRiSz2tI6
Block modules do not display subtitles, some display excerpts for the post
https://forum.tagdiv.com/excerpts-introduction/
The slide in particular does not display an excerpt. That could only be achieved through code modifications, here are some similar topic
https://forum.tagdiv.com/topic/subtitle-in-slider/
https://forum.tagdiv.com/topic/how-to-show-excerpt-in-slider-module/

Thanks

Catalin
tagDiv Staff

Hello Somosung,

You should target each category in the code if you want to use a different color for each of them. Above, I gave you a hint but further, notice that you should implement it yourself because we cannot provide custom services at the moment, sorry! For more information about how you can create your custom CSS code, please check the following useful tutorial here -> https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/

Hope this helps!

Thanks for your understanding!

Simion C.
tagDiv Staff

Hi,

Read the topic carefully and try the solutions. Clear caching and purge CDN files if used, after each modification. I found another similar topic here
http://crunchify.com/how-to-fix-access-control-allow-origin-issue-for-your-https-enabled-wordpress-site-and-maxcdn/
There are probably more suggestions online that you could try, or contact you hosting and explain the situation or provide theme with a screenshot of the issue (use the browser inspector console). They might be able to provide a working solution.

Thanks

Simion C.
tagDiv Staff

Hi,

Please check the theme system status section
https://www.screencast.com/t/TFPsnKgO8
Make modifications to the WordPress and server parameters mentioned in this guide, if requried
https://forum.tagdiv.com/system-status-parameters-guide/
You could ask your hosting provider to make these changes for you, as they might have a recommended method in this matter.
If there is still a problem, please deactivate all plugins except theme plugins and clear any installed cache. Then check in the theme panel while saving settings, if there are any errors in the browser console. Press F12 to bring up the inspector window and then open the console
https://www.screencast.com/t/ENQ5a8CB8
Check if there are any errors in this console. The admin ajax process could be blocked by the server, because of the multiple requests that it makes. In this case you can contact the hosting provider and explain this situation or provide a screenshot with the error.
They should be able to fix it if this is happening.
Please let us know the results.

Thanks

Simion C.
tagDiv Staff

Hi,

1. Please check the line height settings for the menu items and increase the value if necessary in the theme panel
https://www.screencast.com/t/QyhnOr3BOxh
Also if you have custom code targeting the header, or made other modifications to the header check those as well.

2. That is a padding top set by the theme. You could remove it with a code like this, in general
https://www.screencast.com/t/h345SZ6WZ5v

.td-main-page-wrap {
padding-top: 0;
}

Or maybe by page ID (this can be identified with the browser inspector for example)
https://www.screencast.com/t/2ck6LgpNDag
Enter the code in Theme panel->Custom CSS section.

3. There is an option in the theme panel that allows you to change the top menu background color
https://www.screencast.com/t/e2EXgiPbOqE
Change the color there and it will have to be displayed. Clear any caching installed after making the modification.

Thanks

MESOTU
Participant
#0

Hi guys,
I’ve created a blog post using the default blog post format. The image is 704 pixels wide and when I view the published post in Safari, the image is reduced to 591 pixels wide and leaves an ugly space.

See image here: https://imgur.com/a/FeLM3 Excuse the opaque overlay. I was using the web inspector to show the image shrunken down relative to the actual allotted space.

When I view the same post in both Firefox and Chrome, the featured image renders fine without that gap on the right side.

I have tried clearing the cache of my browser and my caching plugin. I’ve purged the URL. I’ve cleared the image and page from my CDN. I tried different images and it’s all the same in Safari.

Would welcome any suggestions you might have.

Kind regards

Simion C.
tagDiv Staff

Hi,

1. You could make those specific menu items aligned next to the search, with custom code
https://www.screencast.com/t/eOmJtwDn

#td-header-menu .menu-item-824,
#td-header-menu .menu-item-825,
#td-header-menu .menu-item-826{
float: right;
}

2. That could be done with custom code as well, there is no options in the them for this specifically. Each menu item has a unique Id that can be used
https://www.screencast.com/t/5qQR4KiCoig
https://www.screencast.com/t/68fSPO4eAHVH

#td-header-menu .menu-item-303 a {
color: red;
}
#td-header-menu .menu-item-313 a {
color: blue;
}
#td-header-menu .menu-item-311 a {
color: green;
}
#td-header-menu .menu-item-312 a {
color: grey;
}

You can use any color you want in the code, then enter it in Theme panel->Custom CSS.
This is a useful guide mentioning how to use the browser inspector tool to create custom code
https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/

Thanks

ltonline
tagDiv Member

Hi Catalin, thank you for your reply.

I tried that. But I would like to have an extract of the post content in the list and the ones there, without image, do not show the text.

I was playing a bit with CSS (In the browser Inspector) and I was able to hide the image by setting visibility hidden to the thumb. but I don’t know if that will affect other categories too…

Here is the result = https://www.screencast.com/t/15rJJiNpPcB

I would like to get the same result, but that the blank space where the image was suppose to be place, disappear, so the text move to the left.

  • This reply was modified 8 years by ltonline.
Catalin
tagDiv Staff

Hi,

All the custom CSS code should have to be added in Theme panel -> Custom CSS area. This tutorial -> https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/ might be useful for you for creating your own CSS custom code.

Thanks for the message!

Simion C.
tagDiv Staff

Hi,

You can try it like this, with a custom class
https://www.screencast.com/t/lxqM0SfBFsPG

.class26 .entry-title a{
font-size: 15px!important;
font-style: normal;
font-weight: 300;
}

There are options in the theme that allow customization for the font of each module
https://www.screencast.com/t/dNaolWCeE
But for more specific customization, you can use custom classes, as you are.
This is a tutorial about using the browser inspector to identify the elements on the page and their classes, and create custom code
https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/

Thanks

Simion C.
tagDiv Staff

Hi,

A code like this will make the header menu items change background color and font color only on hover, as you mentioned (use the colors you want)
https://www.screencast.com/t/r4blu480

#td-header-menu .sf-menu > li > a:hover {
background-color: red;
color: white;
}

Enter it in Theme panel->Custom CSS if you decide to use it.
You can use the browser inspector to identify the elements on the website and the classes used, to create custom code. This is a guide
https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/

Thanks

Simion C.
tagDiv Staff

Hi,

You can use the browser inspector to identify the elements on the page and their classes, and create custom code
https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/
In this example I have set an inner shadow for the modules inside a big grid (there are multiple shadow examples or generators online)
https://www.screencast.com/t/lUrIT8bvQcfF

Thanks

Simion C.
tagDiv Staff

Hi,

Use the browser inspector to check where exactly is that padding coming from
https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/
If there is an issue, please provide details about it or a link to your website, so we can inspect it.

Thanks

Simion C.
tagDiv Staff

Hi,

There should not be any problem is saving theme panel settings. Please check the theme system status and see if the parameters are set according to this guide
https://forum.tagdiv.com/system-status-parameters-guide/
You could ask the hosting provider to make theme for you if needed. Then check if everything works properly.
If there is still a problem, please deactivate all plugins except theme plugins and clear any installed cache. Then check in the theme panel while saving settings, if there are any errors in the browser console. Press F12 to bring up the inspector window and then open the console
https://www.screencast.com/t/ENQ5a8CB8
Check if there are any errors in this console. The admin ajax process could be blocked by the server, because of the multiple requests that it makes. In this case you can contact the hosting provider and explain this situation or provide a screenshot with the error.
They should be able to fix it if this is happening.
Please let us know the results.

Thanks

Viewing 25 results - 726 through 750 (of 1,099 total)