[kimberley]

Hello, please can someone help me. Id like to remove the page title on shop (home/shop) so that the image on the page moves up.

Id also like to adjust the width so that when on desktop view or not on responsive, the pages fit the screen. On a small mobile or tablet some of the right hand side of the site is cut off. Is there anything i can do to change this so that the full site can be viewed on a smaller screen when responsive is off or in the desktop view of my wptouch plugin?

My site is

https://www.thehairysausage.co.uk/cart/shop/

Thanks very much in advance.

Kim

[Mahesh]

@lmkele: For removing page title in shop page, go to Dashboard=> Appearance=> Customize=> Theme Options=> Custom CSS box and add the following CSS:

.post-type-archive-product .page-title {
    display: none;
}

For making the site site fit on both desktop and mobile devices, you’ll need to turn on Responsive Design. Go to Dashboard=> Appearance=> Customize=> Theme Options=> Responsive Design and uncheck Check to disable responsive design option

Regards,
Mahesh

[kimberley]

Hi thanks so much for the response.

I tried that CSS this is what my CSS box looks like

#branding img {
max-height: none;
}

.post-type-archive-product .page-title {
display: none;
}

also tried like this –

#branding img {
max-height: none;
}
.post-type-archive-product .page-title {
display: none;
}

it doesnt seem to be working, not sure what ive done wrong.

Re the responsive – ive enabled it now for you to see – but there are issues. A double menu which we dont want and too much white space between logo and contact us widget

Also too much white space between the slider and post below it. Would also want the post content to be wider to fill the page more and so it all looks even, the feature products 2 on each line.

These were the reasons we chose plug in for the responsive instead. Can the above responsive issues be fixed?

Thanks very much again

[kimberley]

Hi thanks so much for the response.
I tried that CSS- this is what my CSS box looks like

#branding img {
max-height: none;
}
.post-type-archive-product .page-title {
display: none;
}
also tried like this –
#branding img {
max-height: none;
}
.post-type-archive-product .page-title {
display: none;
}
it doesnt seem to be working, not sure what ive done wrong.

re the responsive – we dont want the theme responsive enabled because there are too many issues with the way it looks.(mentioned in my earlier post) We have the WP touch plug in so that people can switch to desktop version which is how we want it but the width on the desktop version or on a small screen without responsive enabled isn’t right. We want the website content to fit the screen fully and not have some of it cut off when responsive is not enabled. Is this possible?

Please view the site and switch to desktop version on a small screen to see what i am trying to change.

Really appreciate your help.

Thanks
Kim

[Mahesh]

@lmkele:
Hi Kim,

I guess, you’ll need to contact the Plugin support for the issue. Because the the title is hiding fine in the desktop version it is only appearing in the mobile only if you switch to Mobile version. While desktop version is fine just the responsive issue since the Responsive Design is turned off.
As far as I understand you requirement, using some custom CSS may fix the issue. Go to Dashboard=> Appearance=> Customize=> Theme Options=> Custom CSS box and add the following CSS:

.wrapper, 
#site-generator .wrapper {
    padding-left: 0;
	padding-right: 0;
}

#catchflames-woocommerce.hentry {
    padding: 0;
	margin: 0;
}

#catchflames-woocommerce.hentry .products{
	margin: 0;
}

.woocommerce ul.products li.product, .woocommerce-page ul.products li.product, .woocommerce-page[class*="columns-"] ul.products li.product, .woocommerce[class*="columns-"] ul.products li.product {
    margin: 0 0 1.5em;
}

Note:
1. Turn on Responsive Design.
2. The Gap between slider and post is because there is are empty <p> tags in page-description which is causing the issue. Please remove those tags and it will look fine.

Hope this helps. Let me know if any problem.

Regards,
Mahesh

[kimberley]

Hi again,

Thanks so much for your help. I’ve made the changes, im still missing some of the right of the site in desktop version. Should i have just made the page content a smaller size on the main site for this to fit right on a smaller screen? I had thought we may just be able to set a max width on the desktop version for mobiles as i saw a similar request on a different theme/forum.

Re the note on responsive, i couldn’t locate the empty <p> tags, please can you advise where they in the description for me to remove?

Re the original page title issue – yes i think ‘Shop’ has now gone but i wanted to get rid of the page navigation on the shop page to not have the ‘home/shop’ at the top of the page, is there a way to remove this?

Thanks very much again.
Kim

[Mahesh]

@lmkele: Sorry, little issue in code, please add the following instead.

.post-type-archive-product .page-title, 
.woocommerce-breadcrumb {
    display: none;
}

#catchflames-woocommerce.hentry .products{
    margin: 0;
}

.page-description img.alignleft.wp-image-1298.size-full {
    display: block;
    float: none;
    margin: 0 auto;
}

.woocommerce ul.products li.product, .woocommerce-page ul.products li.product, .woocommerce-page[class*="columns-"] ul.products li.product, .woocommerce[class*="columns-"] ul.products li.product {
    margin-bottom: 1.5em;
}

@media screen and (max-width: 540px) {
    .wrapper, 
    #site-generator .wrapper {
        padding-left: 0;
	padding-right: 0;
    }

    #catchflames-woocommerce.hentry {
        padding: 10px;
        margin: 0;
    }
}

Note:
1. home/shop will also be hidden with the above code.
2. Please turn responsive design.

Re the note on responsive, i couldn’t locate the empty <p> tags, please can you advise where they in the description for me to remove?
-> Go to the page and edit it, then in content, go to text tab, you may see two <p> </p> tags at the end, remove it and save it.

Re the original page title issue – yes i think ‘Shop’ has now gone but i wanted to get rid of the page navigation on the shop page to not have the ‘home/shop’ at the top of the page, is there a way to remove this?
-> Above CSS will remove this.

Hope this helps. Let me know if any problem.

Regards,
Mahesh

[Author]

Posts