Forum Replies Created
-
-
We can close this now, its fixed 🙂
I experimented with your code and came up using everything below that works
phone: 2 per row on portrait, 2 per row on landscape ( I added 2 lines to the first thing you gave me above)
ipad: 2 per row on portrait, 4 per row on landscape (4 per row is default in Theme options)
desktop: 4 per row@media(max-width:700px) {
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product { width:48%;}
.woocommerce ul.products li.product figure figcaption {display:none !important; }.woocommerce ul.products li.product:nth-of-type(2n+1) {clear:both; }
.woocommerce ul.products li.product:nth-of-type(3n+1) {clear:none; }}
@media only screen and (orientation: portrait) {
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product { width:48%;}
.woocommerce ul.products li.product figure figcaption {display:none !important; }.woocommerce ul.products li.product:nth-of-type(2n+1) {clear:both; }
.woocommerce ul.products li.product:nth-of-type(3n+1) {clear:none; }}
This fixed it for the IPAD in portrait, but created the same problem for phone in landscape mode. If its too tricky, then I will just go back to previous CSS. Just let me know, thanks.
Kept both of the last two CSS recommendations and “sold by” popup is hidden for mobile and ipad, everything looks great except when in portrait mode on IPAD, the shop page is displaying products like this
**
*
**
*
**
*instead of 2 every row.
IPAD Landscape mode shows 4 per row…correct
Mobile phone shows 2 per row in either orientation…correct
desktop mode shows 4 per row….correctGreat, that fixed it on the mobile phone view, for either orientation. I have 2 per row and mouse hover info does not show.
How do I turn off the mouse hover info when viewing on the IPAD in Portrait orientation?
When holding the Ipad in landscape orientation, the mouse hover info is not there, looks good. When I rotate it to portrait orientation, then it automatically appears on all products.
Follow up question, and sorry if I already posted this in another thread, but couldn’t find, so will ask again.
Do you know a way on the buddypress groups directory page, to have the background of each group box set to the Group Cover image that we assign with this BP Cover Photo plugin?
Currently, its the same solid background color for each group in the directory list.
Hi Radu,
That fixed and made it 1 group per row even when you use sidebars.
For anyone else that was following this thread. When add this
.kleo-isotope>.kleo-masonry-item, .kleo-isotope>li {
width: 100%;
}It may also affect you Member directory page and make it 1 per row. If you want it to be 2 members per row, then add
.kleo-isotope>.kleo-masonry-item, .kleo-isotope>li {
width: 50%;
}
to the quick CSS of the individual member directory page.Thanks Radu
Ok I did some more testing and learned a few things.
I added the “for all resolutions” css that you provided above to the quick CSS but no change. Still 3 rows across. So I removed it from the quick CSS but left it in my Styles file.
Then I went to Theme Options -> buddypress and changed the default template for group page to full width. When I do this, then we get 1 group per row on the Group page. If I change the default template to have at least one or two sidebars on the page, it then goes back to 3 groups per row.
Note my buddypress profile page has two sidebars. If I leave the Group page template as full width template. The buddypress profile page, Group tab (where it shows the groups that member has joined), it shows here 3 groups per row.
So basically, if you are on any page that is displaying a list of groups, if there is a sidebar on the page, then it will show 3 groups per row.
If you have another idea, I will try it. If not, then I will make my Group page with no sidebars, and just accept 3 per row on the Buddypress Profile -> Group tab page.
I have add the CSS (for all resolutions) to my styles file, but it didn’t change. We still have 3 groups per row.
fyi, Maybe this will help us figure it out……
We were able to adjust the buddypress “Following and Follower” tabs to display 2 members per row with this CSS:.following #buddypress .kleo-isotope>.kleo-masonry-item, .following #buddypress .kleo-isotope>li {
width: 50% !important;
}.followers #buddypress .kleo-isotope>.kleo-masonry-item, .followers #buddypress .kleo-isotope>li {
width: 50% !important;
}Followed your link and was able to see a form to start a new ticket. I had never been on that page before, so that problem is solved.
I’ll experiment with the new CSS and let you know.. Have a great day!
Radu,
This worked great, the second one above set the default background for the shop page and all of the single product pages at once. Ant then the top one allows me to set an individual product page, if desired. Thanks.******************************
On another topic, for some reason, I don’t see the form to post new questions (ie..start a new thread) anymore under “General Questions” . I can only see the “Reply to” form, to respond to existing threads. Been like this for a week. I tried logging back in, different browsers but no luck. Has something changed with my account?******************************
New question
On my buddypress groups directory page, it list three groups per row. How can I make the directory just list one group per row?I tried to make the box (for each group) full width across by trying this change, but didn’t work. Any ideas?
.kleo-masonry-item, .kleo-isotope > li {
width: 33.3%;
}
to
.kleo-masonry-item, .kleo-isotope > li {
width: 100%;
}OK Laura, I’ll keep trying to figure it out.
Also, can you tell me why I cant post new questions. I have tried logging in/out, different browsers, but I can only reply to existing threads and don’t see the form to start new threads
Hi,
I added the new code you just suggested but I’m not sure what page it is supposed to affect. I didn’t see any difference.
Also, per your direction, I dropped that background plugin. Then I set my Theme Options background to the background I want my buddypress “profile” page to be, since I cant deviated from the background set in Theme Options for Profile page.
I was able to modify all pages (except one, see below) using your code here and just modify the page ID accordingly
body.page-id-9743 .main-color {
background-image: url(http://imgsv.nikon-image.com/products/lens/nikkor/af-s_nikkor_200-500mm_f56e_ed_vr/img/sample/pic_03_l.jpg);
background-repeat:no-repeat;
background-attachment:fixed;
}I tried to modify the WooCommerce “Shop” page using the same way above, with the correct Page ID, but didn’t work. Fortunately, your other code below did work for this “Shop” page.
body.archive.post-type-archive.post-type-archive-product.woocommerce.woocommerce-page #main section.container-wrap.main-color {
background-image: url(http://imgsv.nikon-image.com/products/lens/nikkor/af-s_nikkor_200-500mm_f56e_ed_vr/img/sample/pic_03_l.jpg);
background-repeat:no-repeat;
background-attachment:fixed;
}Lastly, the only page left that I cant modify is the WooCommerce “Single Product Page”. I don’t have a page ID for this one. Im assuming it is dynamically created. It just defaults to the background specified in the Theme Options and not whats specified for the default “Shop” page we took care of above. Can you point me to the special CSS for this page like you did for the “Shop” page?
*********************************************
In addition, I found two useful buddypress plugins that you might like. They will allow your members to pick their own buddypress “profile” page background and admins can set a different background for individual buddypress Group “home” pages. They are http://buddydev.com/buddypress/allow-your-users-to-change-their-profile-page-background-using-bp-custom-background-for-user-profile-plugin/ and http://buddydev.com/buddypress/introducing-buddypress-group-customizer-lite-allow-group-admins-to-change-buddypress-group-background/
