Hi,
I am building my website and encountered some problems. I tried to resolve them by myself but sorry could not find the solution.
1 ) I created a custom side bar as a widget. It disappeared. I was thinking it was my fault so I created the sidebar again.
The sidebar appeared empty on the wp-admin widget page, but I could see it listed in the live personalization tool.
Today, it disappeared again in both sections.
Please see the attached pictures :
http://www.journaldufranc.com/wp-content/uploads/2015/02/nowidg.jpg
http://www.journaldufranc.com/wp-content/uploads/2015/02/nowidget.jpg
2 ) I created an image with the recommended heigh : 90px width : 230px but it does not align properly on mobile.
Here is a screen capture : http://www.journaldufranc.com/wp-content/uploads/2015/02/photo-2.png
How can I fix these two problems ??
Sorry grammar.
Thanks.
Hi,
1. I’m not sure what you mean with created a sidebar as a widget. You can create a custom sidebar from Theme Panel > Template Settings(you can choose a different sidebar for each template) for posts for example: http://screencast.com/t/1Q7yZTzG And it is normal to find it empty in Widgets section, just add widgets to it: http://screencast.com/t/cUctIPwK5tc
And set it to display: http://screencast.com/t/h7SQeDjTM
Result: http://screencast.com/t/88S4IiqgYpZB
2. You use Header Style 3 with blog-stack that why is that issue on mobile. For Classic Block stack we made a special header, this one http://screencast.com/t/FEoXVhLMpcv and in combination with other headers is not guaranteed that everything will work fine.
So if you want to use it like this, please paste this css for mobile view in Theme Panel > Custom Css:
@media (max-width: 767px) {
#td-top-menu .sf-menu {
display: none !important;
}
.blog-stack #td-top-search{
right: -50px;
top: -75px;
}
.header-search-wrap .dropdown-menu {
left: -56px!important;
}
.header-style-3 .td-logo img{
width: 30px;
}
}
Result: http://screencast.com/t/0e2v9SlcLw4e
Thanks!
Your code helped me a lot. Thank you !
About the sidebar I used the wrong terminology, yes I created a sidebar with widgets inside. This is correct. But the content of the custom sidebar disappeared.
So I decided to use only the Newspaper defaut sidebar, and so far it have not been disappearing.
I have read somewhere that this issue can be fixed by clicking on Setting > writings > and then activate the “tell wordpress to correct the broken XHTML code” or something like that.
Thank you.
Oh I have a last problem. As I would like to change this font :
http://www.journaldufranc.com/wp-content/uploads/2015/02/font.jpg
If I understood correctly, I can’t with this template style.
Is there any way to do it with css ?? I know css a bit but the way your template is built far exceeds my understanding.
Thank you.
Hi,
Please try this custom css for categories title: http://screencast.com/t/KzL0KNJHxOdF
.category .td-page-title span{
font-size: 20px;
font-family: Ubuntu;
}
It will customize all categories title, if you want to change font only for a specific category you will have to use category-id class: http://screencast.com/t/nTwDEMbiz
You can find category id on Post > Categories: http://screencast.com/t/zsOcRDeevHv1
Also I see that you permalink that display id of category: http://screencast.com/t/uXKSYb4yBC
Hope this helps!
.category .td-page-title span{
font-size: 20px;
font-family: Ubuntu;
}
Sorry this is not working.
I tried with other class types, such as .entry-content and it don’t work either.
What is missing ? Sorry
Hi,
Please try with !important and see if works:
.category .td-page-title span{
font-size: 20px !important;
font-family: Ubuntu !important;
}
Thanks!
Ok I see it. The font only displays on mobile because of the first code.
@media (max-width: 767px) {
#td-top-menu .sf-menu {
display: none !important;
}
.blog-stack #td-top-search{
right: -50px;
top: -75px;
}
.header-search-wrap .dropdown-menu {
left: -56px!important;
}
.header-style-3 .td-logo img {
width: 30px;
}
.category .td-page-title span {
font-size: 20px !important;
font-family: Vollkorn !important;
}
I tried to separate each with a <style></style> but it seems this is not the proper way to do it.
Sorry I’m such a noob !!
Hi,
Please copy the code exactly how I gave it to you:
@media (max-width: 767px) {
#td-top-menu .sf-menu {
display: none !important;
}
.blog-stack #td-top-search{
right: -50px;
top: -75px;
}
.header-search-wrap .dropdown-menu {
left: -56px!important;
}
.header-style-3 .td-logo img {
width: 30px;
}
.category .td-page-title span {
font-size: 20px !important;
font-family: Vollkorn !important;
}
}You forgot to close an } that’s why it bellow codes are apply on mobile.
Paste the codes in Theme Panel > Custom Css: http://screencast.com/t/ZLX09QoP
Thanks!
Yes. The display + font style is OK on mobile, but the font is still the default font on laptop.
Hi,
That is happens because the code is included in @media for mobile. If you want to change category title for all views just put the } above:
@media (max-width: 767px) {
#td-top-menu .sf-menu {
display: none !important;
}
.blog-stack #td-top-search{
right: -50px;
top: -75px;
}
.header-search-wrap .dropdown-menu {
left: -56px!important;
}
.header-style-3 .td-logo img {
width: 30px;
}
}
.category .td-page-title span {
font-size: 20px !important;
font-family: Vollkorn !important;
}
Thanks!
