Search Results for 'css'

Hi,

You could for example do it like this. I will use a column text in the example.

Place a row in the page, enter a column text or text with title in it, with the text you want. Then set a background image for the row
– https://www.screencast.com/t/ScsK03b1
If you want you can align the text to the right in the CSS tab of the column text
– https://www.screencast.com/t/7tuUsOi8EdWB

Then set a background image for the column text – https://www.screencast.com/t/g7snDmxU
I also set some padding and changed the color of the text to white.

This would be a solution with the result you want.

Thanks

Hi,

Is this is what you want to achieve https://www.screencast.com/t/0smk47jdp0
Then please paste the below custom css in Newspaper>Theme panel>Custom code>Custom css
@media (max-width: 500px){
.alignleft {
float: left;
margin-right: 15px;
}
}

Thanks.

Hi,

Is this is what you want to achieve https://www.screencast.com/t/LVoQwhyFVh8w
then all you need to do is to add the below custom css in Newspaper>Theme panel>Custom code>Custom css
.comments .td-form-email,
.comments .td-form-url,
.comment-link {
display: none;
}

Thank you.

Hi,

You can indeed set a background image and a link for it. I see you have currently set a thumbnail image, please make sure you set it in full size for better results
– https://www.screencast.com/t/5KeOsSjlf9
– https://www.screencast.com/t/Q7jIPljCDrlv

If you want to create a space above the website, so that the ad is displayed there as well, similar to the website you mention, enter this code in the advanced custom CSS->desktop section
– https://www.screencast.com/t/0wUxLtLrx9F5
Result – https://www.screencast.com/t/MlR3CN0hBPr

.td-header-wrap {
margin-top: 115px;
}

Please let us know if you have more questions.
Thanks

Hi,

Please add the below css in Custom css
https://www.screencast.com/t/ZlmbgvrrJM

.td-post-title .td-module-meta-info {
display: inline-flex;
}
.td-post-title .td-module-meta-info .td-post-author-name{
margin: 18px 0 0 10px;
}
.td-post-title .td-module-meta-info .td-post-date {
top: 21px;
}

Thanks.

Hi,

If this is what you want https://www.screencast.com/t/fNF1xeygm
then please replace the above css with this one
.td_block_9 a{
color: white;
}
.td_block_9 .td-post-date{
color: lightblue;
}
.td_block_9 .td_module_8{
border-bottom: 0;
}
.td_block_9 .td-module-comments{
display: none;
}
.td_block_9 .td-block-title span{
border-bottom: 3px solid lightblue;
}
.td_block_9 h3 a:hover{
color: lightblue!important;
}
.td-post-date{
display: none;
}
.td_block_9 .td-post-date{
display: inline-block;
}
Activate the date from theme panel.
The background color is:
And follow the screenshots: #33434d
https://www.screencast.com/t/PbAXjqwHbj7
https://www.screencast.com/t/ElrjkScIurMy
https://www.screencast.com/t/RQztmRueUB
Hope this will help you.

Thanks.

Hi,

That is a customization made in the demo stylesheet directly
– https://www.screencast.com/t/th6GTWCsP0
That is because in the theme panel you can only set a solid color as background, not gradient
– https://www.screencast.com/t/YusfYYz1pI

To change the colors used you could override the demo customization with a similar code but use the colors you want. For example
– https://www.screencast.com/t/c64R74TlqC49
If you should consider it, this is the code for it

.td-fast-news .td-header-wrap .td-header-menu-wrap-full,
.td-fast-news .td-header-menu-wrap.td-affix {
background: linear-gradient(to right, #aebc22 0, #4f6565 25%, #8b0081 100%) !important;
}

Replace the colors with the ones you want, then enter the code in Theme panel->Custom code CSS section.

Thanks

Hi,

If the images you use as featured are small, then the theme won’t be able to create the larger thumbnails that grids use for example. If larger thumbnails are not created the images will be displayed as they are, not stretched.

In case that you cannot set larger images as featured for the posts, you could maybe try some thumbnail upscale plugins that could stretch the images to fill the modules.

With CSS it may be possible as well. I could give it a try, provide a link to the website where I can test.

Thanks

Hi,

If you want to add for all h2, and h1 center align just paste the below css in Newspaper>Theme panel>Custom code>Custom css
h1, h2 {
text-align: center;
}
If you are using mobile theme you need to paste this css in Neaspaper>Theme panel>Mobile Theme> Custom code ” WRITE YOUR OWN CSS HERE ” too, in this way will apply on mobile too.

Also you can fallow our tutorial about Create custom code with the browser’s Inspector or the Live CSS Box

Thank you .

Hi,

If this is what you want https://www.screencast.com/t/AktCBxkV1AP3
Then please add this custom css

.td-header-style-12 .td-main-menu-logo, .td-footer-bottom-full .td-pb-span3 {
float: right!important;
}
.td-header-style-12 #td-header-menu {
float: right;
width: 900px;
}
.td-header-style-12 .td-main-menu-logo, .td-footer-bottom-full .td-pb-span3 {
float: left;
}
.header-search-wrap{
position : relative;
}
.td-header-wrap .td-drop-down-search {
left: 0;
}
.td-header-wrap .td-drop-down-search:before {
left: 19px;
}

Thanks

Hi,

If this is the result you want https://www.screencast.com/t/lpc2qEiF2TJ , then please add the below css in Newspaper>Theme panel>Custom code> Custom css
.td-header-style-12 .sf-menu > .current-menu-item > a, .td-header-style-12 .sf-menu > .current-menu-ancestor > a, .td-header-style-12 .sf-menu > .current-category-ancestor > a, .td-header-style-12 .sf-menu > li > a:hover, .td-header-style-12 .sf-menu > .sfHover > a {
background-color: black!important;
}

This will work only for header stile 12

Thanks.

Hi,

That is the Newspaper theme from what I can see, this is the Newsmag forum.

Newspaper has a few block header styles to choose from
– https://demo.tagdiv.com/newspaper/block-header-1/
Most of theme are left aligned however, or center aligned. This is because the right side is where the ajax filter is displayed
– https://www.screencast.com/t/gTQAf2T1Lzu

If you don’t plan on using ajax filters you could use some CSS
– https://www.screencast.com/t/U7XnTHaM9Ky
This code is general, it will affect all the block titles in the website when used

.block-title {
text-align: right!important;
}

Thanks

Hi,

Please add the below custom css in Newspaper>Theme panel>Custom code>Custom css
.td-big-grid-post:hover .td-post-category{
background-color: rgba(0, 0, 0, 0.7)!important;
}
Hope this will help you.

Thank you.

Hi,

1. I believe you are referring to the category tags – http://prntscr.com/likf3f
Those have predefined colors, they could only be changed with CSS, not by a theme setting.

I could try and give you a solution, mention for which elements you want to change the color, which blocks and where. A link to the website/page would be helpful so I can test.

For example something like this would work for all the category tags at once
– https://www.screencast.com/t/kFYKB3RkS

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

2. Maybe something like this – https://www.screencast.com/t/1IPmNEYmVI
The menu will start from the right if you enter this code in Theme panel->Custom CSS

@media (min-width: 767px) {
#td-header-menu .sf-menu li {
float: right;
margin-right: 14px;
}}

3. I could take a look, provide a link to where the grid is in your website and exact details about what you want to do.

4. Seems the theme will override the font weight on mobile, it will set a font-weight of 600, so the one from the theme panel will not apply anymore
– https://www.screencast.com/t/rhlVigkI6Hh
I will add this on our list of issues, I don’t think this is intended to happen. As a quick fix I could give you a code to make sure your desired font weight applies. For example
– https://www.screencast.com/t/t5hkyCyH

.td_block_big_grid_4 .td-small-thumb .entry-title {
font-weight: 100!important;
}

Let me know.

Thanks

Hi,

Please paste in Newspaper>Theme panel>Custom code>Custom css the below code
.td-header-style-12 .td-main-menu-logo, .td-footer-bottom-full .td-pb-span3 {
float: right;
}

See the results: https://www.screencast.com/t/bFEowfFjO
https://www.screencast.com/t/qiMqEBQyzbKw
This css will work only on header (Style 12), and in footer(Style 5).

Thank you.