Search Results for 'browser inspector'

Results from the Forum
Catalin
tagDiv Staff

Hello colognedude,

Use the inspector browser -> https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/ and target the specific class you want to change. Sorry, if you do not provide your website I cannot provide you a more accurate response.

Thanks.

Simion C.
tagDiv Staff

Hi,

I have tested some of the code you mention and it seems to work properly. For example the modification to the link color in the post content, and the blockquote
https://www.screencast.com/t/CSlPW65DYB
Most of the font properties of blockquotes can be changed in the theme panel, except the color modification
https://www.screencast.com/t/6BHQmcP4tX
Blockquote color can be changed in the theme panel as well
https://www.screencast.com/t/VaBVOKk63S
Where there are no settings available, you could use the browser inspector and identify the elements and classes present, in order to create custom code
https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/
If there is a visible delay present before the code is applied, try entering the custom doe directly in the theme stylesheet.

Thanks

Simion C.
tagDiv Staff

Hi,

You could try to change the fonts for the Woocommerce account page, in this file
https://www.screencast.com/t/t7a1AlRUbAe
Maybe there are also plugins that would allow you to customize the different fonts used by Woocommerce. Or apply them with custom CSS code.
Inspect the page with the browser inspector and identify the elements used and the classes and create custom code
https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/

Thanks

Bogdan B.
tagDiv Staff

Hello,

1) For custom css please use the theme panel-> custom code section https://www.screencast.com/t/9FYBuFG1YNs
If you say that using style.css has little to no effect it means your code is not proper and will not apply. Please use the browser inspector and cahck to see if your code applies to the specific element or there is another more powerful selector than yours taking over.

2)Each of the examples you mention are affected by the theme accent color in the theme panel: https://www.screencast.com/t/NvGdVkg2s6

Thanks.

Simion C.
tagDiv Staff

Hi,

I will add the request on our list, but please understand that I cannot say exactly if or when something like this will be available. There are many suggestions and recommendation on our list, and it is hard for the developers to decide what gets implemented as soon as possible, and what gets postponed.
Unfortunately we do not have a customization department at the moment, so we cannot provide custom work or major website modifications. If you would like to achieve the results you want, you could consider hiring a freelancer/developer to help you. Or do it yourself, but be aware that this may not be an easy task.
If a background image is set then the website will become boxed, in order to display the background. The Revolution slider layout can be changed in it’s settings
https://www.screencast.com/t/xn72LPn4HFV
The revolution slider is a very complex plugin with many settings. Her you can find all the official documentation
https://www.themepunch.com/revslider-doc/slider-revolution-documentation/
You can make it display like this when a background is set
https://www.screencast.com/t/cHFj7z2mB
https://www.screencast.com/t/Ydhd0Y3t27
https://www.screencast.com/t/VYjBepdM
All the containers you mention have a white background. There is no option to change that color, by default. Some demos might have a different custom styling.
You could use the browser inspector to identify the elements on the page and the classes used in order to create custom code
https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/
You will have to change the default background color or modify it with opacity to achieve what you want
https://www.screencast.com/t/7eLTiInP
https://www.screencast.com/t/hUtvYOmJsYre

Thanks

Simion C.
tagDiv Staff

Hi,

You can choose from a big number of blocks, each with a different design and look
https://demo.tagdiv.com/newspaper/block-1/
And choose from the unique theme demos, which are custom made
https://demo.tagdiv.com/select_demo/select_demo_newspaper
I could give you a code to have a border for the modules on your page, and some similar padding like the site you mention
https://www.screencast.com/t/6EAYuXoEdwz
You could also control and limit the length of the article title and excerpt so the modules would be more similar
https://www.screencast.com/t/gTGbwRzh1DZm
You can enable the category tag on the module, and maybe than author name and date as well
https://www.screencast.com/t/MkdO1wCL61
https://www.screencast.com/t/UQnScBe6
This is the code if you decide to use it, enter it in Theme panel->Custom CSS

.td_module_2 {
border: 1px solid #E3E3E3;
}
.td_module_2.td_module_wrap .entry-title,
.td_module_2 .td-excerpt {
padding: 15px 16px;
}

If you want to further customize the module, you could use the browser inspector to identify the elements and classes used, in order to create custom code
https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/

Thanks

Simion C.
tagDiv Staff

Hi,

That means the the code is somehow creating that space, if removing it seems to resolve the problem. You can use the browser inspector to identify where the space is coming from exactly
https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/
Or provide a link to your website where this is happening, so we can inspect it.

Thanks

Simion C.
tagDiv Staff

Hi,

If you want the logo like that it would require to change the height of the logo image, as well as the whole header probably. Simply stretching the current logo image will not produce the best results.
You can use the browser inspector to identify the elements and classes used, and create custom code for modifying the logo, if it is absolutely necesarry
https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/

Thanks

Simion C.
tagDiv Staff

Hi,

You could try a code like this, to modify how the mobile menu displays
https://www.screencast.com/t/W5biIPBy5C
There might be more modifications needed, but this will give you a starting point if you want to make further customization. You can test the code and see if it is working properly.
Enter it in Theme panel->Mobile theme->Custom CSS section (you can test with other values by modifying the code)

.td-menu-background,
.td-mobile-container {
width:50%;
height: 50%;
}
.td-mobile-container .td-menu-socials {
height: 120px;
}
.td-mobile-main-menu li a {
border-bottom: 1px solid black;
padding: 15px 45px 15px 15px;
}

Here is a link to a tutorial about using 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/
The code can then be used in the theme panel custom code sections.

Thanks

Simion C.
tagDiv Staff

Hi,

Try deactivating all other plugins except the tagDiv composer and clear any caching installed. Then create a new page and edit it with the composer. If there is still a problem, press F12 to access the browser inspector console and see if there are any errors, while trying to edit the page.

Thanks

Simion C.
tagDiv Staff

Hi,

I have tested the translation feature, and translated to french without any problems
https://www.screencast.com/t/Oj5eNUsEgZhw
Be sure to save the settings after the translation has been loaded, in order to display the results.
If the translation is not working, try disabling all your plugins except the ones provided with the theme, clear any installed cache and try again. Also check with the browser inspector for errors (press F12 and in the console section) while translating in the theme panel. The process could be blocked.

Thanks

Simion C.
tagDiv Staff

Hi,

Please check with the browser inspector in the theme panel, while trying to make modifications and saving. In some cases the ajax request made by the theme when saving settings, is blocked by the server. This could be the cause of the problem. More useful information in this topic
https://forum.tagdiv.com/topic/cant-save-theme-options-2/

Thanks

Simion C.
tagDiv Staff

Hi,

There is no option at the moment in the theme panel, to modify the font on that element.
Simple modifications can be made using some custom code.
You can follow this tutorial and 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/
Or you can specify what exactly you want to do, and I will help you.

Thanks

Simion C.
tagDiv Staff

Hi,

You can try a code like the one provided below. It should make the homepage, category pages and posts have the container background color that you choose
https://www.screencast.com/t/shvOiA4EHjo
https://www.screencast.com/t/eMKNFFYdD
https://www.screencast.com/t/wJFTfgDt9h1
If you want to add more elements, you can identify them with the browser inspector and add their classes to the code
https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/
The code must be entered in Theme panel->Custom Css section

.td-header-container,
.td-main-content-wrap,
.td-category-header,
.td-category-grid,
.post {
background-color: lightgrey;
}

Thanks

Simion C.
tagDiv Staff

Hi,

Some header styles have a required logo size, the logo should be uploaded in the mentioned size for best results
https://forum.tagdiv.com/logo-favicon/
Header styles 9, 10 and 11 do not have a required size. You can use any image size you want in these styles
https://forum.tagdiv.com/header-styles/
There is no theme option to modify the header height. It can only be done with custom modifications. If you want to try, here is a tutorial about how you can use the browser inspector to identify the elements used on a page and their classes, in order to create custom code that you can use in the theme panel
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 used on the page. You will see that the blocks used are these
https://www.screencast.com/t/9lLRSzFQ2
You could do the same like this
https://www.screencast.com/t/DkxBUPPIN
https://www.screencast.com/t/9Ejxfmbv
https://www.screencast.com/t/AgBFcLt2ulf5
Split the row in three columns, add Block 14 with a 1 limit post in each column, then Block 9 just after it. Of course the demo has it’s own style and design for these elements, so they will not be looking exactly like in the demo.
You could copy the style from the demo and make them look the same if you want
https://www.screencast.com/t/clcnDE13
https://www.screencast.com/t/JvNqMjEjv

Thanks

Simion C.
tagDiv Staff

Hi,

There would be no need for such major changes. Please note that the Prepare time and other elements that you mention in this screenshot
https://www.screencast.com/t/Vs7Y5thB
These are simple HTML elements that have corresponding classes, defined in the Recipe demo
https://www.screencast.com/t/YEx1W8HtDyM
https://www.screencast.com/t/NOWNpUHE21L
If you want to achieve something similar simply recreate the HTML structure using the same classes and enter the CSS code provided above in the Theme panel-Custom CSS section.
You can find more using your browser inspector, to analyze the elements on the page, and their classes
https://www.screencast.com/t/J34akXLZz33o
https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/
Here you can find more information about post formats
https://forum.tagdiv.com/post-formats-for-tinymce/
Regarding the logo, the Recipes demo uses Header style 11. This header style does not have a limit for the logo size. You can use any image you like
https://forum.tagdiv.com/logo-favicon/

Thanks

Simion C.
tagDiv Staff

Hi,

This can be done, you just have to use the right code. You can use the browser inspector to identify the elements used and their classes in order to create custom code
https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/
For example you can try a code like this as a start, and maybe add more classes or more customization
https://www.screencast.com/t/sWZ8sfRiophH
https://www.screencast.com/t/O4SItaVQD
https://www.screencast.com/t/sICsFHBh2KV
https://www.screencast.com/t/yziOjRMA
The code must be entered in the Theme panel->Mobile theme->Custom Css. This can be improved the way you like, by adding more elements or removing them.

#td-outer-wrap {
background-color: #000;
}
.block-title,
.td_module_mob_1 .entry-title a,
.page-nav .current,
.td-page-title,
.td-category a,
.entry-title,
.td-post-content,
h1, h2, h3, h4, h5, h6,
.td-author-name a,
.author-box-wrap .td-icon-font {
color: #fff!important;
}

Thanks

Simion C.
tagDiv Staff

Hi,

For removing the gradient, you could try a code like this
https://www.screencast.com/t/2WwLwdIxV9
Enter it in Theme panel->Custom Css

.td_block_big_grid_fl_7.td-grid-style-1
.td-module-thumb a:last-child:before {
display: none!important;
}

For the border I don’t know how exactly you want it to be. You could use something like this for example
https://www.screencast.com/t/pyKTqI3tO

.td_block_big_grid_fl_7 .td-module-thumb {
border: 1px solid blue;
}

Or create your own code and customize the grid modules the way you want. Use the browser inspector to identify the elements present and their classes and create custom code
https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/

Thanks

Simion C.
tagDiv Staff

Hi,

We appreciate you thoughts on the theme. This modifications would not be as easy as you think. These elements were not designed to be displayed in other situations then their initial purpose. It would probably take much Css code (where possible to modify this way) to override the current classes and their values, and then set new ones.
If you would like to try this, here is a guide that you can use to identify the elements and their classes, in order to create custom code
https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/

Thanks

Simion C.
tagDiv Staff

Hi,

It could be a plugin that is causing the issue. Try as a test if possible, to deactivate all your plugins except the ones included in the theme package, clear any caching installed and check if the problem is solved. Switch to the main theme if you are using a child theme. Check any customization you might have made to the theme files, or added in theme panel.
The theme makes many requests to admin-ajax file, the security module from your server may treat it as a threat. In some cases this file is banned by the server and the theme cannot access it anymore. Try to contact your host provider and ask if that file is banned or if there is any firewall on the server which may block the request.
While saving in the theme panel, press F12 to see if there are any errors in the browser inspector console.

Thanks

Simion C.
tagDiv Staff

Hi,

Sorry, I failed to see the link you have provided in your post. You could change the button color and font properties with a code like this for example
https://www.screencast.com/t/84PrdYwgspX
You can change the properties as you need, and also add more

.more-link-wrap a {
color: red;
background-color:green;
font-size: 20px;
}

Here is a link to a guide that explains how you can use the browser inspector to create custom code, that you can use in the Theme panel->Custom Css
https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/
Please let me know if you need further help.

Thanks

Bogdan B.
tagDiv Staff

Hello,

You can float any menu item right by their menu id.
Please check your menu html with the browser inspector and get the list item class then add a float:right to them in the theme panel-> custom css box.

Thank you!

Simion C.
tagDiv Staff

Hi,

The author Id is created by WordPress. There are many ways of finding this Id
http://www.wpbeginner.com/beginners-guide/how-to-find-post-category-tag-comments-or-user-id-in-wordpress/
https://forum.tagdiv.com/topic/author-box-5/
Some elements can be customized with Css and offer the possibility to set a unique class to them. For example you have two block elements of the same type, with no particular way to differentiate them
https://www.screencast.com/t/I3rLwdhnEH
By setting a custom class to one of them, you can customize it with Css without affecting the other one
https://www.screencast.com/t/qdr5fkCP
https://www.screencast.com/t/Wq1xJeAU
There are also many other situations in which this option may be helpful.
Here is a tutorial about uisng teh browser inspector to create custom code, that you can use in the theme panel
https://forum.tagdiv.com/create-custom-code-using-the-browsers-inspector/

Thanks

Bogdan B.
tagDiv Staff

Hello,

I did not log into your site as I do not have a username or password to do so. I just accessed it as any other user and inspected the code in the browser inspector. The issue is unrelated.

Thanks

Viewing 25 results - 776 through 800 (of 1,099 total)