I am using a WordPress theme.
only my main menu gets too long without a scrollbar. After several trying to figuring it out still no solution. see screenshot: http://prntscr.com/in1o7s
I hope you guys can help me!
Thanks in advance
If you want to force scroll of an element, add "overflow-y: scroll" css directive. Example:
.scroll-menu {
overflow-y: scroll
}
Related
I am new to WP don't know how does the theme customization work. I've chosen receptar theme (link)
I want to make the article items on the main page bigger by default, as I would do with Ctrl +. How Can I do it?
I want to change it from this :
to this:
Word of caution: always try to fix things yourself and let us know what you've tried before asking on SO. Everyone here is happy to help once you hit a roadblock.
Now, to fix the issue you need to modify the Width of the element. I changed it from 50% to 100%. When it is 50% it allows two items to be next to each other, so if it is 100% every item will take all the space it can, getting to what you're looking for.
You can copy and paste this code into your theme CSS styler:
.posts .hentry {
width: 100%;
}
Usually, all themes come with this, or if your version of Wordpress is 4.7+ you can do this through the customizer.
That should do the trick.
You can easily do this with CSS,
please go to your theme main style.css and add this CSS
.post {
width: 100% !important;
}
I am looking to edit the css styles from inside the Dashboard inside of wordpress and NOT have to edit the php files if possible.
I know it is possible to edit at least some of the properties so my hope is I can edit all of them right within the dashboard.
MORE SPECIFICALLY
How can I change the css states of links and submenus of a custom class? For example the a:active, a:hover, a:link etc... and ALL OF THE SUB-MENUS to custom css as well?
I have included these pictures to show you what I am trying to do and the present results.
MY CUSTOM MENU INSIDE OF WORDPRESS
CUSTOM CSS INSIDE OF WORDPRESS
THE RESULTS
I am taking the time to give a little more details in gratitude for all the help I got on stackoverflow over the years, also giving a little more info for the newbies out there. We are all learning.
Here is what worked in pictures
I used Firefox and used "INSPECT ELEMENT". While on the page I did a LEFT CLICK and from drop down I chose INSPECT ELEMENT.
Then I clicked on the PICK AN ELEMENT icon, as seen in the picture and then I hovered over the element I wanted to edit, in this case a button in the menu. This gave me the class I needed to edit.
I went into my DASHBOARD in WordPress and made this change to the code. Finally I got the results I was looking for, which I also included in the same picture as well.
Although I have not figured out how to edit the sub-menus yet I believe I am on the right track and will figure it out.
HOPE THIS HELPS SOMEONE. :)
I have a serious problem with the Magento 1.9 new theme (RWD) on mobile media only and wondered if anyone might be able to shed any light please, if I'm honest, I'm not even sure where to start troubleshooting this one.
If you view the product detail page on a mobile phone (or on Chrome emulation mode).
http://magento19.my.phpcloud.com/index.php/tori-tank-581.html
Click on one of the alternative product images and then try and scroll down on the page, you can't it is completely stuck, it will only allow you to scroll if you use the white space either side, or below the image.
I'd be massively grateful for any ideas?
Thanks in advance
Check to see if you made any CSS changes to overflow visibility... We had a small gutter on the right in our rwd templates. We "fixed" this by making a css change to the overflow. This simple change caused the no-scroll/jerky-scroll that made the page look partially rendered.
Try to add this in _catalog-product.scss:
#include bp(max-width, $bp-medium) {
.product-img-box {
.product-image {
pointer-events: none;
}
}
.zoomContainer {
pointer-events: none;
}
}
This one helped me.
I need help for modify my site. I'm new to this, please help me:)
Can I move my logo to center of very top menu? You can check my site. My site is here.
You can see the 4 item, I would like to move my logo between 'life' and 'story'.
Thank you and have a nice day!
Lukas's answer: Just create another <li> element inside the <ul id="secondary-nav"> and move the <div id="branding"> or better only the <a> inside. Probbaly you should also remove the float:left on the logo.
= Yes I understand and I test this on F12(developer tool), It works great! But my problem is I don't know where I can create <li>. I find <ul id="secondary-nav"> on F12. I guess I have to edit "header.php". Am I right? Can I know exactly where? Please help me:)
JSfiddle:http://jsfiddle.net/user3543818/UNnYp/2/ (You can see "header.php" and CSS for top menu)
yes you can , if you want give us the code but :
put youe logo in new div and make it padding : 0 auto
or you can put it as your screen old you
please send us the code
It is hard to tell with just a link, but it looks like you are using a template you purchased. If that is the case, a lot of purchasable templates have settings within the wordpress dashboard that will allow you to customize certain parts of the look-and-feel. Logo placement is often one of those editable features.
A code example would make it easier to give you an exact answer, but in this case it seems like you can simply add your logo as a menu item in between life and story, so it will be displayed in the center of the list. This can be done through your wordpress dashboard as well, or you can hardcode it in the template.
if you want your logo top of your site, you can use float: inherit;
if you want it exactly between the menu items, you must define your logo as a li (list item) and put it between 'life' and 'story'.
Just create another <li> element inside the <ul id="secondary-nav"> and move the <div id="branding"> or better only the <a> inside. Probbaly you should also remove the float:left on the logo.
You can do that:
.yourlogo{
margin-right: 7px;
}
How to make a WordPress theme (site) scroll horizontal. Here is one of the example I want my site to look like http://www.lucky8solutions.com/about/about-lucky-8-solution/
Thanks in advance
It's not as simple as changing one simple setting, you'll have to rework the whole theme.
This will get you started:
overflow-y:hidden; //hides vertical scrollbar
overflow-x:scroll; //always shows horizontal scrollbar