Hi Guys,
I want to change the font on the “Review Overview” and remove the “Summary” entirely. Is there a way to do this with either the Theme Panel or CSS? Thanks so much!
http://www.irreverentgent.com/wp-content/uploads/2016/07/Screen-Shot.jpg
Hello, I’m trying to customize my input file in CF7
Hello, I’m trying to customize the layout of the CF7 file upload form (input[type=”file” i]). My problem now is when I try to upload a file: I would that the string “no file selected” changes when file is uploaded. How can I change it?
Picture: https://www.dropbox.com/s/6szxq8l5g7ee8af/Screenshot%202016-07-12%2022.51.52.png?dl=0
Thanks in advance,
Toti.
PS: Below the custom code
___________My CF7 custom code___________
<div class="uploader">
[file sand-file limit:5mb filetypes:gif|png|jpg|jpeg]
<span class="filenamer" style="-webkit-user-select: none;">Nessun file selezionato</span>
<span class="action" style="-webkit-user-select: none;">Seleziona Immagine</span>
</div>
___________My CSS custom code___________
.uploader {
margin-bottom: 20px;
height: 50px;
width: 100%;
background: #fff;
border: 1px solid #ddd;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
cursor: pointer;
position: relative;
overflow: hidden;
-webkit-transition: all 0.2s ease-in;
-moz-transition: all 0.2s ease-in;
-o-transition: all 0.2s ease-in;
-ms-transition: all 0.2s ease-in;
transition: all 0.2s ease-in;
}
span.filenamer {
text-overflow: ellipsis;
display: block;
font-size: 13px;
overflow: hidden;
white-space: nowrap;
float: right;
text-align: right;
cursor: default;
height: 50px;
line-height: 50px;
width: 200px;
padding: 0 10px;
color: #999;
}
span.action {
height: 44px;
margin: 2px;
padding: 0 30px;
color: #fff !important;
font-size: 13px;
line-height: 44px;
font-weight: 700;
text-transform: uppercase;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
text-align: center;
float: left;
display: inline;
overflow: hidden;
cursor: pointer;
-webkit-transition: all 0.2s ease-in;
-moz-transition: all 0.2s ease-in;
-o-transition: all 0.2s ease-in;
-ms-transition: all 0.2s ease-in;
transition: all 0.2s ease-in;
background: #FF7B74 !important;
}
input[type="file" i] {
opacity: 0;
width:100%;
height: 100%;
cursor: pointer;
}
div.uploader input {
opacity: 0;
filter: alpha(opacity=0);
-moz-opacity: 0;
border: none;
background: none;
position: absolute;
top: 0;
right: 0;
float: right;
cursor: pointer;
width: 100%;
height: 100%;
}
.wpcf7-form-control-wrap {
position: initial;
}
Hi Andrel.
Theme accent color does not affect my hover colour. is it limited based on the header selected.
also i copied your css to the customer css and got no results change.
No matter what i change it stays dark grey. i hope to not be one of those annoying clients but can you please assist with another option?
Much appreciated
http://www.useoftechnology.com/
Hi Catalin, where can I reference the custom css code to set menu hover colours for specific categories?
Thanks
Matt
HI
Try this css in theme panel > custom code > custom css to change the background color for drop-down menu: http://screencast.com/t/qoWfDq9mW
.sf-menu ul li{
background-color: red;
}
Thanks!
Hi,
The full width of the iphone is 320px, but we have also some padding right and left to center the post content. You could try to use a smaller ad size or you could try this custom css in Theme Panel > Mobile Theme > Custom Code – http://screencast.com/t/ZQspc17MlwaZ – http://screencast.com/t/vs45OENUQiv
.td-post-content .td-a-rec {
margin: 20px -15px 15px !important;
}
Hope this helps!
Hi
Sorry for this inconvenience. The indicated solution does not work with V7+ of Newspaper. Comment this code from editor-style.css to remove the sidebar: http://screencast.com/t/76LiLEWa
Let us know how it goes.
Thanks!
HI
Try this css in theme panel > mobile theme > custom code:
.page-id-61 .td-mobile-sub-footer-wrap {
display:none!important;
}
Thanks!
Hi
@all,
Unfortunately this issue is not theme related. It happens on every theme and every site if you use a cdn server. So you can understand what is going on, a cdn will cache your site and serve it from the cdn server instead of your own server to limit the stress on your server and improve loading times. But it cannot load the fonts. The fonts need to be loaded from the same source in order for them to display properly. A cdn cannot load the fonts for you so this issue occurs. This should be as a warning on every cdn server out there…In this case you need to edit your htaccess and set the allow origin code so fonts can be loaded through cdn. This is different for everyone as the htaccess is different in each case. I cannot provide a general solution as there is no general one. The allow origin method works for all users only the implementation method is different for each case. Try to find a few extra resourcess so you can see how different people have them set up and test it out on your end:
https://www.google.ro/search?num=100&safe=active&espv=2&q=allow+origin+cdn+htaccess&oq=allow+origin+cdn+htaccess&gs_l=serp.12…0.0.0.53106.0.0.0.0.0.0.0.0..0.0….0…1c..64.serp..0.0.0.MqGeYUtEyfw
The most important thing to do after you add the allow origin code to your htaccess is to clear cache and purge cdn files.
Here are a few refference links:
https://davidwalsh.name/cdn-fonts
https://wordpress.org/support/topic/css-fonts-missing-no-access-control-allow-origin-header
http://webmasters.stackexchange.com/questions/52695/access-control-allow-origin-not-working
Thank you!
Ok,
I seem to get the general idea of what you are trying to achieve. My I suggest a much simpler way of doing it with the theme settings?
If you only require a list of your latest posts at the top of the blog page, why not create a static page using one of the blocks to show the content and simply adding a block called latest posts on top and filtering it to show the latest posts and chose one of the block styles that comes close to your design. It’s much easier this way. You can maybe use this block: http://demo.tagdiv.com/newspaper/block-7/ and hide the featured images with css.
Here is an example of how it will show:
http://screencast.com/t/KkjNdZ1Q You can also use css to remove a bit of the spacing.
If this is a viable solution for you, then I can help with any required css.
I hope this helps.
Thank you!
Hi Bogdan,
Thanks for your help. I tried putting the code in the Custom CSS box but it did not work. Also, I got a yellow exclamation mark about use of !important. Can you please have another look?
Thanks!
Hi,
The colors you mention can only be changed with custom css as there is no setting for them. Please use this code for the ajax filter (menu):
.td-subcat-filter .td-subcat-list a, .td-subcat-filter .td-subcat-dropdown span, .td-subcat-filter .td-subcat-dropdown .td-subcat-more i{
color:black!important
}
And for the excerpts, please use this code:
.td-excerpt{
color:black!important
}
You can add the codes in the theme panel->custom css box
Thank you!
Hello,
You can use this custom css to remove them as there is no setting for it at the moment:
@media(max-width:767px){
.td-category-siblings{
display:none!important;
}}
You can add the code in the theme panel->custom css box.
Thank you!
Hi,
If you want to change the font for the element, you will have to use the font-family property: http://www.w3schools.com/cssref/pr_font_font-family.asp
You can add it to the code provided above.
Thank you!
HI
You can use this css to hide main menu and footer from a specific page:
.page-id-36 .td-header-menu-wrap, .page-id-36 .td-footer-container{
display: none;
}
Just change the id with your page id where you want to hide the main menu and footer.
Hope this helps.
Thanks!
Hello,
If you want to move the comments form above the comments, then you have to edit this file like so:
http://screencast.com/t/yo7Js7uu3ye and then http://screencast.com/t/9O7YtytQ
It will require a few css modifications as it will lose it;s style if you move it outside of the theme containers though.
Thank you!
HI
Try this css to make for smart-list buttons: http://screencast.com/t/OEgRqQ3nl7W
.td-smart-list-dropdown-wrap .td-smart-back {
opacity: 1;
}
You can move the line here and the ad will be displayed inside each slide.
Thanks!
Alright, actually doing this my self is faster than searching for the solution which is a bit strange.
I have worked out how to hide the title, just like before I placed it in the custom CSS under the Newspaper theme control panel. This is what I put in there,.sticky .entry-title {display: none;}.
So all I can see now is the text I am putting on the actual page. My next step is to find the code that will display the titles and date, of the latest 5 or so articles, one line break after the other. As well as working out how I will do the editors picks in a similar way. (I want that code sitting on the sticky page)
I want to add that I have looked at the code in loop-single.php and worked out how to hide all the meta data in a sticky post for the purpose of achieving what I want, as explained in my original post above.
I placed, .sticky .td-module-meta-info {display: none;}, within the custom CSS on the Newspaper theme control panel.
However, I can’t have the subject/title showing as the title has nothing to do with what I am wanting to achieve here, but I can’t work out a way to remove it yet. I am still working on it. I could remove the title from the page in the page editor under admin, but I want it there so that myself and other authors of my site can see what it is for. I will post my solution if I find it.
Thanks for your response. This is important as it’s what makes my website unique, but not only that, it provides navigation in a very quick way for regular visitors. Based on feedback, my visitors prefer me having quick links near the top of the posts which are easily accessible. (so best here, than on the side menu)
I have a coding educational background, I just haven’t used it for a very long time, so I was hoping for a quick answer, but it looks like I will have to do some manual work here. I am finding it really time consuming setting everything up! But it’s enjoyable. I am new to wordpress, which is part of the problem. I have been with blogger for six years
When saying all that, it may be best for me to try and get the sticky post option working, and hiding all the fields. Then I can simply update that post whenever I want to make the changes I need without impacting the front page, and list of posts below that. I thought that you may have had a regular question from clients around hiding fields in sticky posts so would have been able to tell me the CSS code specific to your themes fields such as comments, the date, author, etc. I wan to hide everything though and just have what is in the contents of the sticky post/page displayed.
Hi, I inserted the same code for the mobile theme under the custom CSS and the footer still shows on mobile, is it an other piece of code I need for the footer not to show up on mobile ? Is this a support forum please or do I need to email ?
I have searched the forum for the answer but nothing works. What’s the CSS code for changing the hover on the social boxen of the Social Counter?
This?
.td-social-box>a:hover{
color:#dd3333!important;
}
HI
Try this css to set a background color for these images:
.wpb_single_image .vc_single_image-wrapper.vc_box_shadow_border:hover {
background-color: red;
}
This is just a basic example but you can customize it by adding other css properties on same classes.
Hope this helps.
Thanks!
Hi,
You can use this css:
.td-g-rec-id-content_bottom{
float:left!important;
}
Also if you want to have bigger ads, keep in minf tht the content width is 696 px so if you selected a 700 px so you will have to chsoe another size for your ad in order for it to fill the container: http://screencast.com/t/lGDpPw2IMHtP
Thank you!
HI
The theme does not have an option which target that item but you can try this css to target the sub-menu elements: http://screencast.com/t/VHI5HPyewUj7
.sf-menu ul {
background-color: red!important;
}
Thanks!
