Search Results for 'css'

Hi,

1. Please note that the theme width overall cannot be changed. It should not be attempted by custom code. The theme has a fixed width, and all the elements used are dependent on this fact. Modifying the width will most likely break the website. There are precise values used that will not display properly under different circumstances.
On pages you can stretch rows to full width, using the composer. Header and footer elements can be stretched in the theme panel. But a general setting for width is not available.

2. You could adjust the line height for the header menu
– https://www.screencast.com/t/ki24ggk4sU
Increasing the line height value will affect the header menu height.

3. The search icon is a font, it could be increased with some CSS
– https://www.screencast.com/t/WobUXDutVP4
Hamburger menu icon as well
– https://www.screencast.com/t/hOC404fGB
This is the code used in the example, adjust it as you like

.header-search-wrap .td-icon-search {
font-size: 50px;
}
#td-top-mobile-toggle i {
font-size: 50px;
}

The Travel blog demo uses a different header style, so the code will not work. Either change the header style to 6, or modify the header style in the code. Might need to adapt more of the code as well.

When you uninstall the demo, this will remove all the demo settings. The theme panel will be reset. The theme has an option to export/import theme panel settings
– https://forum.tagdiv.com/import-export-theme-settings/
That should be the only case that the theme panel is affected.

Thanks

Hi,

The only option would be with CSS, the footer content will be displayed on the whole website regardless of desktop or mobile. You could use the mobile theme plugin, as this uses other files. Then make modifications in the mobile theme footer file
– https://www.screencast.com/t/pIP93JWZPwf

Thanks

Hi,

1. Grids and blocks will display posts according to the configuration you set for each of them. If you use the same settings for the grid and the block, then the posts displayed will be the same. Please check this block settings tutorial
– https://forum.tagdiv.com/block-settings-tutorial/
Filter the elements on the page differently so they will not display the same posts. If it is required to use the same categories you can use the offset feature
– https://forum.tagdiv.com/offset-feature/

2. You could do that with a code like this
– https://www.screencast.com/t/egH4VJoYVgh

.td-header-style-5 .sf-menu > li.td-normal-menu > ul.sub-menu {
left:0;
}

Enter it in Theme panel->Custom CSS section.

3. The width of the page cannot be changed. It is not recommended to make any modifications concerning the width of the theme. This will break the website layout, all the elements on the page are dependent on the fixed width defined in the theme stylesheet.

4. You can try plugins to create a table, at the moment the composer does not have a specific element for table creation. Try a few plugins and see which one works properly.

5. As well, plugins can be used to create subscription forms. I believe there are many free subscription plugins that would allow you to do this.

Please let us know if you have more questions, or you need further help.

Thanks

Hi,

Use the code as provided, replace only the page ID and it should work properly regardless of header style used. Enter the code in Theme panel->Custom CSS section
– https://www.screencast.com/t/XNm2oSNTe
Or use the Live CSS editor when editing the page
– https://www.screencast.com/t/Yp5Ru45nZ
Then check the results.

Thanks

Hello whyistayhungry,

Try to use the code below and place it in Theme panel->Custom CSS area.

.td-header-style-6 .td-header-main-menu.td-affix {
-webkit-background-color: white; color: red;
}

Thanks for the message!

Hi,

That can be achieved with some CSS code. If you would provide more details about how exactly you want it to be (or a screenshot), I will give you a solution.

Thanks

Hi,

The header style you are using at the moment is style 7. I have inspected the menu, but there is no problem with it when hovered or active
– https://www.screencast.com/t/iMi5vMHff4bg
– https://www.screencast.com/t/ku2OekxEtT
If the problem is happening when you switch to header style 5, please note that the gadgets demo you have installed has some custom design, that applies to that header style only
– https://www.screencast.com/t/tJYkpVk7XW
A combination of that design and theme panel settings can cause the issue you are describing. Either use a different header style like you are now, or simply modify the black color in the location shown in the screenshot.
Regarding the logo not displaying, there seems to be a CSS code that prevents in to appear
– https://www.screencast.com/t/reCe8EbRqyg7
– https://www.screencast.com/t/vvc2D0NpK
Check the theme panel custom code sections, or any location you have inserted custom code. Removing that code will cause the logo to appear
– https://www.screencast.com/t/IAIWo4Rx

Thanks

Hi,

It would be helpful if you could provide a link pointing to the issue if possible, for a more accurate solution. It could be a simple CSS issue.

Thanks

Hi,

Leave that code for desktop and enter this one in Theme panel->Advanced CSS in the phones section – https://www.screencast.com/t/VDf0vC11mp

.single.woocommerce #tab-description ul .product {
margin-left: 5px!important;
}

Thanks

Hello kastech,

Unfortunately, please notice that our theme does not support any full-width page and that’s why you cannot achieve this, sorry!
Our product does not have such an option for dynamic width and we do not recommend to do that through the custom CSS code because the layout of the theme will be damaged. If you want to change the width of the theme to be in full-width mode, please notice that is not a simple task and you will have to adjust the entire theme to the new width for better results.

Thanks for your understanding!

Hi,

The theme doesn’t have an option for this, but you could try to hide them using custom css.
For example you can hide the meta info on post page and category page using this css code – https://www.screencast.com/t/nsvV95tW – https://www.screencast.com/t/kywadqiL2

.category-applications .td-module-meta-info {
display: none;
}

Replace applications with your category slug.

Also to hide next/prev and comments:

.category-applications .td-post-next-prev, .category-applications .comments {
display: none;
}

Thanks!

Hi,

1. You could use block 8 which displays the thumbnails to the right
– https://demo.tagdiv.com/newspaper/block-8/
So you can place a block 2 limited to 1 module, and block 8 below it, producing the result needed
– https://www.screencast.com/t/isWabx7qc
Or use a code like this to modify block 2 with some CSS
– https://www.screencast.com/t/94vPVuqheJs

.td_block_2 .td_module_6 .td-module-thumb {
right:0;
left: auto;
}
.td_block_2 .td_module_6 .item-details {
margin-right: 116px;
margin-left: 0;
}

The theme does not have a clock icon like the one from the screenshot. That is probably achieved through a plugin, or modifications to the theme modules. You can see what information modules can display by editing one of them
– https://www.screencast.com/t/HkaFGVDSOZy

2. The code to modify this block is like this, it will switch the thumbnails and meta positions
– https://www.screencast.com/t/F5vzlreXJQ

.td_block_1 .td_module_6 .td-module-thumb {
right:0;
left: auto;
}
.td_block_1 .td_module_6 .item-details {
margin-right: 116px;
margin-left: 0;
}

Thanks

Hi,

I cannot seem to be able to view the images you posted
– https://www.screencast.com/t/5JkBQCXmRnrS
Please note that is is important to use an image size exactly as recommended in the guide.
I see that the image you are using is somewhat bigger in size, the CSS set on the logo could cause a blurry appearance in this case. Try entering this code in Theme panel->Custom CSS and check the results
– https://www.screencast.com/t/wqnfEdN0XKg

.td-header-style-1 .td-header-sp-logo img {
max-height: 100px;
}

Thanks