Community Forums › Forums › Archived Forums › General Discussion › Agency Pro WooCommerce Page
- This topic has 11 replies, 3 voices, and was last updated 10 years, 1 month ago by wyattwerner.
-
AuthorPosts
-
March 12, 2014 at 12:12 pm #94478taracaMember
Hello All:
I've been trying endlessly to edit the background of my Woocommerce "Shop" page. As it appears now, It looks horrid; currently it has a no back ground surrounding the products, thus the products blend in to my site background image. I would like it to look like a regular post or page content entry.
http://healingwithcoconut.com/?post_type=product
I have tried editing the CSS in the via the *Css Containers* and the *Entries* with...
.entry .page-id-25 {
background-color: #fff;
border-radius: 3px;
margin-bottom: 40px;
padding: 40px 40px 24px;
}AND
.page-id-25 .entry {
background-color: #fff;
border-radius: 3px;
margin-bottom: 40px;
padding: 40px 40px 24px;
}AND
.page-id-25 .site-inner,
.wrap {
background-color: #fff;
margin: 0 auto;
max-width: 1140px;
position: relative;
}None of these seem to work, even with minor variations 🙁
I have also installed the Custom Backgroung Plugin which works on all other pages, except for the "Shop" page.
I can however change this
.site-inner {
background-color: transparent;
margin: 0 auto;
max-width: 1140px;
position: relative;
}To this
.site-inner {
background-color: #fff;
margin: 0 auto;
max-width: 1140px;
position: relative;
}But that changes every page, and looks like crap on anything other than a desktop.
Thanks in advance.
http://healingwithcoconut.com/?post_type=productMarch 12, 2014 at 2:28 pm #94510AnitaKeymasterTry this. You may need to move the CSS over to the style sheet so you can modify it.
Love coffee, chocolate and my Bella!
March 12, 2014 at 3:33 pm #94519taracaMemberThanks Anita!
I'm currently at the point of copying the files, however, once copied it asked for the "Destination directory for selected item(s)", which I've tried putting in Woocommerce (the new folder name) Woocommerce.css (new folder name), and variations themes/agencypro/woocommerce with no luck (sight says "target directory does not exist").
Thanks again.
March 12, 2014 at 3:43 pm #94521taracaMemberOpps, that Woocommerse.css is the new file name, which wasn't listed as a step in the tutorial, although I'm guessing mandatory so that you have somewhere to put the copies of the files. ?
March 12, 2014 at 4:52 pm #94526taracaMemberFound the path to the file and thus was able to move it. No, new file needed in the new folder 😉
New Question: Where does the code in Step 1 go in regards to the beginning or the end of the functions php? After following the steps, I now have a internal server error.
March 12, 2014 at 5:52 pm #94532taracaMemberSite is back up and I can see the woocommerce css when using firebug, but not in my dashboard style sheet, which is where I need to make the changes. Any suggestions or explanation of why it's not visible there and how to get it there to make permanent changes?
March 12, 2014 at 5:57 pm #94533AnitaKeymasterStep 2 says, "Create a new folder named woocommerce in the root directory of your child theme." - Did you create the new folder in the root of your child theme?
Step 3 says, "Copy over the woocommerce.css file from the WooCommerce plugin to your child themes woocommerce folder." - Did you copy over the woocommerce.css from the plugin to the new woocommerce file folder?If you followed these two - then when you go to Appearance > Editor - look on the right hand side and you should have a style.css link and a link that says woocommerce.css. Do you see the woocommerce.css?
Love coffee, chocolate and my Bella!
March 12, 2014 at 6:05 pm #94534taracaMemberYes, I did, I created a new folder under my theme/agency-pro.
Yes, I copied them to the folder and they are there.
There is no woocommerce.css in my editor.
March 12, 2014 at 6:07 pm #94535AnitaKeymasterOk, so since you followed Brad's instructions, post this issue on his blog and he will respond to you. Tell him you followed them correctly.
Love coffee, chocolate and my Bella!
March 13, 2014 at 6:19 am #94636AnitaKeymasterI see your dialogue with Brad on his post. Send me a message on my website using the Contact. I want to set up a link for you so you can share your Desktop with me remotely so I can see what you've done so far. Maybe I can figure it out for you.
Love coffee, chocolate and my Bella!
March 14, 2014 at 12:49 pm #94893taracaMemberThanks Anita for you extended help and ensuring that the steps that I followed on the tutorial were accurate. I finally found the glitch, which may not be a glitch with other file managers, being a newbie, I don't know how others are set up. Per my tickering, I discovered that the steps are more accurately stated and followed as such:
Step2
Create a new file (not folder) named woocommerce in the root directory of your child theme.
Step3
Copy over the woocommerce.css folder (not file) from the WooCommerce plugin to your child themes woocommerce file (not folder)
Go to plugins > woocommerce > assets > css to copy the woocommerce css folder (not file) into your new woocommerce file.
As for the customization of my shop page's background, I found a simple snippet of code to plug into my php that customized that page only as the Custom Background Extended plugin wouldn't work.
The code is:
.woocommerce div {
background: rgba(255,255,255,.8);
}Thanks again!
March 14, 2014 at 3:14 pm #94927wyattwernerMemberThe process in Brad's article worked perfectly for me. I got rid of the bad WC background by adding this to the new woocommerce.css file in /themes/minimum/woocommerce/
.wrap { background: transparent; }
-
AuthorPosts
- The forum ‘General Discussion’ is closed to new topics and replies.