richarduk
Forum Replies Created
-
Forum: Plugins
In reply to: [Simple Lightbox] Excluding links?alchemweb.co.uk/showcase-sites/
I’m messing around with another plugin to see if I can get that to work but you might be able to see the issue. Thanks!
Forum: Themes and Templates
In reply to: [Childishly Simple] Header containerI have no idea why the footer’s not there. I’ve just checked by downloading your version of the theme and uploading it to my test site and ‘page-without-a-title’ as the front page and everything’s ok. I can only guess that someone has been messing around with the template file ‘page-without-a-title.php’
You can stop the green line being covered up by changing the z-index of the div to 1000 as below. THis should also keep the phone number 20px in from the left. Paste this little lot into ‘Add HTML, javascript etc.’ > and then the second or third or fourth box down, but definitely not the first which is where it is at the moment because that’s outside the website.
<div style="position:absolute;top:325px;background-color:transparent;left:20px;z-index:1000;"> <p style="color:red;font-size:25px;font-family:arial;font-weight:bold; font-style:normal;">Заказ авто 8(925)044-4511</p> <p style="color:#369b1e;font-size:1rem;font-family:arial;font-weight:bold;font-style:normal;">с 7-00 до 22-00 без выходных</p> </div>The last code lines (which will be included in the next update) should be in the ‘Add CSS, javascript or shortcode’ > the last item in the head of all pages’ (the very top options box).
Yes, there’s still work to be done to make this simpler e.g. adding the option to put the HTML etc. in the ‘header-container’ div
Forum: Plugins
In reply to: [WooCommerce] WooCommerce Product Images Blurry and not Fittingre. http://www.dooblay.com/product/coffee-pothead-t-shirt/
Firefox, inspect element shows the following in woocommerce-layout.css:
.woocommerce .related ul li.product, .woocommerce .related ul.products li.product, .woocommerce .upsells.products ul li.product, .woocommerce .upsells.products ul.products li.product, .woocommerce-page .related ul li.product, .woocommerce-page .related ul.products li.product, .woocommerce-page .upsells.products ul li.product, .woocommerce-page .upsells.products ul.products li.product { width: 48%; }Changing 48% to auto moved the images closer.
http://www.dooblay.com/shop/ showed the left image container extending half the page. This was caused in woocommerce.css by:
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product { width: auto; }Removing that line width:auto shrunk the image containers to al fit nicely into the page.
http://www.dooblay.com/product-category/fooddrink/ had the same problem of the left image container being too wide, caused in woocommerce.css by:
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product { width: auto; }Again removing width:auto made everything hunky dory.
Looking at your stylesheets it looks like woocommerce-layout.css comes first, then further down woocommerce.css
This is a pain because it appears that woocommerce-layout.css in this case should come last as it sets the width of each individual container e.g. 25% but this is being over-ridden by woocommerce.css with its generalised ‘width:auto;’ Both are using identical CSS selectors. From where I can see in this case it looks like WooCommerce made a mistake and have got the stylesheets in this instance the wrong way round.
Woocommerce.css should be first and woocommere-layout.css should come after it.
How to get round it? I don’t know. You don’t want to be editting stylesheets on every upgrade.
P.S if you’ve been pasting in my CSS as well this makes it all the more complicated. Hope my CSS hasn’t confused things even more!
Forum: Plugins
In reply to: [WooCommerce] WooCommerce Product Images Blurry and not FittingIf the featured image is the tub of icecream from that link then in FireFox using WebDeveloper > Image information it says the image is 300 x 300 and when I measure it using ‘Measureit’ that shows 300 x 300.
The related products are coming out as 450 x 450 in Firefox but there are no images as yet. I would suggest putting some related product images in ‘cos that might make a difference or might make it easier to see what’s going on.
Forum: Themes and Templates
In reply to: [Childishly Simple] Header containerOkay.
First, you don’t have a footer, which means the end of the document</body? </html>is missing which isn’t good.
The telephone number as you have it is doing what the CSS says, which is indenting from the right by 22%. To change that you’re going to have to use media queries. If you tell me what width / resolution your phone is and if you want the telephone number left, middle or center I can sort that for you hopefully.
Anyhow, try the following. In theory the lines shouldn’t overlap.
<div style="position:absolute;top:325px;background-color:transparent;right:22%;z-index:10;"> <p style="color:red;font-size:25px;font-family:arial;font-weight:bold; font-style:normal;">????? ???? 8(925)044-4511</p> <p style="color:#369b1e;font-size:1rem;font-family:arial;font-weight:bold;font-style:normal;">? 7-00 ?? 22-00 ??? ????????</p> </div>You have a scrollbar on the bottom and that’s because you have one long unbroken line————-
Paste the following into the very top options box and that should sort it. I shall update the next version of the theme to include this.
<style type="text/css"> div.entry: word-wrap:break-word; } </style>Forum: Themes and Templates
In reply to: [Childishly Simple] Header containerOpen the second big options box down (add HTML etc.) by clicking on the + sign.
4th box down will say something like, ‘This is below the top navigation’
Paste this in changing the values to suit. Make sure that the height isn’t too big or it might cover up navigation menus or other links, so check that links work near where this appears.
It’s a workaround but should do the job.
<p style="position:absolute;top:200px;background-color:transparent; color:red;font-size:1rem;font-family:arial;font-weight:bold; font-style:normal;height:30px;left:10%;z-index:10;">012345678</p>Forum: Themes and Templates
In reply to: [Childishly Simple] Search formTry
div.left-sidebar-item input#searchsubmit { margin-top:10px; display:block; margin-left:auto; margin-right:auto; }or
div.left-sidebar-item input#s { display:block; margin-bottom:10px; } div.left-sidebar-item input#searchsubmit { display:block; margin-left:auto; margin-right:auto; }or to get it all on one line
div.left_sidebar_woocommerce widget_product_search form#searchform{ overflow:auto; } div.left_sidebar_woocommerce widget_product_search input#s { display:block; float:left; font-size:12px; width:80px; } div.left_sidebar_woocommerce widget_product_search input#searchsubmit { display:block; float:left; /*or try float:right;*/ font-size:12px; width:65px; }Apart from that I’m fresh out of ideas without actually messing around with it and seeing what works.
Forum: Themes and Templates
In reply to: [Childishly Simple] Search formTry
`div.left-sidebar-item input#searchsubmit {
margin-top:10px;
}or
div.left-sidebar-item input#searchsubmit {
padding-top:10px;
}`It looks like it’s a WooCommerce feature / widget and I’m surprised that they haven’t styled it better.
Forum: Themes and Templates
In reply to: [Childishly Simple] Search formNo comprende.
You mean the very top search box? It has an input box where you type in text and an icon where an arrow moves when you press it. You want to increase the horizontal distance between the icon and the input box?
Forum: Themes and Templates
In reply to: [Childishly Simple] The question about liquid widthhttp://www.w3schools.com/cssref/css3_pr_background-size.asp
With CSS3, supported in modern browsers, something like the following should do the trick:<style type="text/css"> body { background-size:100%; } </style>Try this:
<style type="text/css"> p.post-date{ display:none; } </style>Yes, the ‘Add CSS etc.’ box. Make sure that the styles begin and end with:
<style type="text/css"> your CSS </style>This should over ride any child themes as it’s further down the pecking order of style sheets – external styles, then internal styles, then inline styles take precedence over previous styles.
The reason the custom css sometimes works, sometimes doesn’t is that in the header of this theme there are external styles e.g. style.css called, then internal styles, then the external style style-custom.css I should have made it much clearer that style-custom.css is only to be used in very rare circumstances (I’ve done that now in the next version) because sometimes the internal styles will take precedence over style-custom.css and sometimes the other way round.
Usually internal styles take precedence over external styles but it depends if the external styles come before or after the internal styles and it also depends on how ‘specific’ styles are e.g.
div.outer div.inner {color:red;}is more specific thandiv.inner {color:red;}and so carries more weight.If you’ve got this far then the short answer is take your CSS out of style-custom.css and put it in your child theme’s style.css and it might work, or failing that put it in that very top options box again (so long as there’s not loads of it because internal styles have to be loaded every time a page is loaded whilst external styles are cached on the user’s computer).
If it still fails to work you’ve probably done something wrong with the CSS – first thing to do is validate it. http://jigsaw.w3.org/css-validator/
I always choose direct input and copy and paste it in.
Forum: Plugins
In reply to: [WooCommerce] WooCommerce Product Images Blurry and not Fitting@ Thomas Schmall
No idea. If it was me and I felt that that small increase in size wasn’t acceptable then I’d simply knock 10px or whatever off the sizes that I set and then regenerate thumbnails. 🙂
And if I was feeling really awkward I’d go to the Woocommerce forums, wherever they are, and ask. But I wouldn’t in all honesty expect to get a valid reply otherwise they’d have sorted out the various issues mentioned in this thread a long time ago.
Do you mean the social media icons? If so I would suggest that there’s a setting there that can display them horizontally. If not try this in the top options box (wrapped in style tags):
ul.scfw_16px li, ul.scfw_24px li, ul.scfw_32px li, ul.scfw_16px li a, ul.scfw_24px li a, ul.scfw_32px li a { display: inline-block; }Forum: Plugins
In reply to: [WooCommerce] WooCommerce Product Images Blurry and not Fitting@ Thomas Schmall
Using Inspect element in FireFox the image HTML for the flower pic is
<img class="attachment-shop_catalog wp-post-image" width="147" height="300" alt="Poppy Flowers, Brush Stroke View" src="http://www.oxpal.com/wp-content/uploads/2013/12/poppy-flowers-painting-poster-147x300.jpg"The CSS in woocommerce.css is
.woocommerce ul.products li.product a img, .woocommerce-page ul.products li.product a img { width: 100%; height: auto; display: block; }The actual image size that I’m getting in my browser is pretty close to the image size specified inline – 152 x 310 px