Forum Replies Created
-
Posts
-
Glad to help @skstudio !
I hate to say it, but looking it over, I don't think it would be the easiest fix. Not one line of code I can generate quickly, like last time. One thought might be just to {display: none;} some part or another of this area, at some media-query breakpoint (600px or so probably), so that we're reducing total width as our screen size is getting smaller. But even if I hide the search menu, the rest floats to the right, when we'd probably want it centered or off to the left. So we'd need to get into editing those css styles at certain breakpoints, too.
You could just hide this whole area at less-than 600px if it's the only piece that is non-responsively designed ... but I'm guessing this stuff is a little too important to just do that.
Sorry I'm not more help just now. Good luck with figuring it all out!
At first glance the code you linked seems just like what you would want, and the nature of the error you describe (not right # of posts) is just weird. I can't think of what would interfere for you...
If I were working on this I would get that code in there, and then take a look at error logs, dev tools console, inspect the source code, etc, to try and diagnose why this isn't working as expected...
To me, it looks like just some of the css that's probably required is missing. (I notice that specific plugin loads no css of its own).
I think if you can just add something like:
.home-welcome .wrap section, .features .wrap section { float: left; text-align: center; }That will help you start getting things lining up better. The float: left is mandatory I think -- and the text-align: center just helps it look a bit clearer out of the box, though I'm not sure center aligned text is what you really want in all these boxes, may want to remove or override that in a more specific context (ie inside the widgets).
Try adding this to end of CSS:
.header-image .site-title a { display: block; float: none; margin: auto; }Displaying it centered in this way may have some unexpected consequences if you put some other content up in the header with the logo ... but looks like you are just getting started and the above will help you do what you're looking to do so far.
-Steve
Looking over your header I think your approach is pretty interesting. Just make the header image (containing the logo) just as big as the entire header, and go from there. Simple and sweet!
Anyways, with how you've got this set up, I think you'll want to take another look at the "background-size" css property. Right now you've got "background-size: contain !important". Which works great at desktop but not mobile sizes. Maybe switch this "background-size" to 1140px? This keeps the background size where you currently have it on Desktop ... but that specific value keeps your logo big on smaller displays.
You might want to add a couple media queries to this, to maybe step the logo size down a bit as you go from 1140px wide, to 800, to 500, to 360 (kind of random breakpoints but you get the idea). But if you just want it to be a big logo for everyone, maybe that single change will serve you well.
When I look at the link you shared, what I see in the source code is TWO images given the <link rel="icon" ... treatment. So maybe it is because you have two site icons specified in this way?
Those "Page Builder" plugins can get a little unwieldy, I've found...but no doubt they can be useful too. Best of luck!
It's an interesting case and question here. I'll admit off the start I'm not too familiar with WPML plugin.
Do you have French and English versions of each and every page? If so, I wonder if we could set up some easy button that could go on all pages, and be there to switch (reload) the pages between the English and French versions. I kind of wish the URLs were consistent between the two, then all the button would have to do is stick "/en/" into our current (french) URL, and the switch between the two would be very easy. Without that, switching between a French and English URL counterpart would require some kind of hierarchical relationship (categories, tags, or some table) to allow us to know what the switch is....SOMETHING to tip us off where the other language URL is, to load it onto that page's button programmatically.
Perhaps I need to learn more about WPML plugin to really know the parameters of this question. Good luck!
Looks like they work - but there is some kind of overlapping of elements that are keeping clicks from working on the links and the search at top (unless you delete a bunch of elements out of the way, which is what I did to make them fire).
I am not saying this is the perfect answer ... it is kind of quick. But I notice that adding
.welcome-text {height: 50px;}
to css is at least a simple way to get those links/search 'uncovered' and working again. I think there is a little deeper mystery as to why these are overlapping, that maybe you want to work on. (there might be some mobile/responsive concerns with my quickfix, too).
Good luck!
I was gonna say, maybe just leave out the widget title (<h4>), and write some <h1> inside the text widget itself?
Or maybe add a small bit of jquery to make this change for you?
Or ... just leave it as h4, and use css to scale the size of the text?
But ... it looks like you already got it just how you want (with the <h1>). So congrats!
Hey,
I was just looking at your site for a minute and it really looks like some of your css code isn't making a lot of sense. For example,
@media only screen and (min-width: 800px) { .site-inner, .wrap { margin: 0 auto; max-width: 1240px; } .content-sidebar .content, .content-sidebar-sidebar .content, .sidebar-content-sidebar .content { float: left; border: 1px solid #D9D9D9; padding: 48.9px; box-shadow: 0px 0px 5px rgba(0,0,0,0.2); } .content { width: 850px; } }You wouldn't want max-width: 1240px rule on .site-inner down to 800px (as your media query is set up), since then we are making sure .site-inner is 1240px even if our screensize is only 800px. Same thing with the rule on .content there - 800px screen doesn't want .content at 850px.
These kinds of rules are making the theme display a lot of weird white space, which I think is the root of the problem you're describing, right?
I went and tried some quick code on the Workstation Pro demo (which is at http://my.studiopress.com/themes/workstation/#demo-full) and this seems to do it - just add that to the bottom of your styles.css file inside Workstation Pro:
header.site-header {
position: fixed;
width: 100%;
}