Help with positioning

Hi Xtemos, I was wondering how would I position the submit button on my contact form 7, form to be inline like the picture. Currently it overlaps the recaptcha. The code below is how I positioned it so far.

<div class="row">
<div class="col-md-6" style='margin-bottom:20px;'>[recaptcha]</div>
<div class="col-md-6" style='margin-bottom:20px;'>[submit class:btn-color-black "SEND MESSAGE"]</div>

Attachments:

You must be logged in to view attached files.

Hello,

Please provide page URL with the form. If your site is under maintenance, please provide your site admin access to the private area.

Best Regards

Hi. Thank you for your reply, I’ve now fixed it. I was wondering if you could help me further with something else please.

1) How do I remove the header background image for search. I’ve removed it for all page headers but cannot find a way of changing it here bizarrely. (image below)

2) How do I align text and a popup theme element as a HTML Block. Currently it’s aligning very odd at the moment. Could you advise me in how to deal with this the correct way.

Our local stores [html_block id="2696"]

3) How can I disable the SKU field only on product pages though.

Attachments:

You must be logged in to view attached files.

Hello,

Please provide your valid site URL and page URL with issue 1 and 2.

Add this code to the Theme Settings > Custom CSS > Global:

.single .meta-location-add_to_cart .product_meta>span.sku_wrapper {
display:none;
}

Best Regards

I’ve included the details below. The sku has been removed with your code thank you.

Hello,

Please specify step by step what I should do to reproduce the problem https://gyazo.com/788fa2bf46c1d01d344f61034df38698 seems it was a matter of cache.

You need to include the text into HTML block https://gyazo.com/5ad390d2748644c33f028c235ea8fc68 add a text block and insert http://prntscr.com/odngxj

Best Regards

Hi, thank you for your message back

Sorry if you go to search and put in a, — Allow the search box to load bringing up results — scroll down to get the view all results and you will see where the background image is at the top.

I’ve done what you’ve said but get this (image shows) they are massively far apart.

Best regards

Attachments:

You must be logged in to view attached files.

Hello,

Enter the shop page and remove the background on the title or change it. The Search results page inherits the settings of the Shop page.

Best Regards

Hi Elise. Thank you for that was bugging me for a while but so easy and simple in the end.

I’m still having problems with my question 2 from above.

2) How do I align text and a popup theme element as a HTML Block. Currently it’s aligning very odd at the moment. Could you advise me in how to deal with this the correct way. The area affected is the area classed as after ‘add cart area’

I’ve followed what you said but get this (image below), they are massively far apart. How would I get them to being closer like image two?

Best regards

Attachments:

You must be logged in to view attached files.

Hello,

Make the columns narrower and align the text and the button of the popup to left and to the right accordingly.

Best Regards

Hi Elise,
I’ve tried all that and I’m still facing problems with it. On mobile/tablets it’s appearing on separate rows (image). Also it isn’t centred on desktop either.

Attachments:

You must be logged in to view attached files.

Hello,

Set 1 column width for both: text and popup https://wpbakery.com/video-academy/responsive-column-control-width-offset-param-usage-explained/

Best Regards

Thank you all sorted now.

Could you please advice me in how to work this, I’m trying to make a link in short description to open or navigate down to the Shipping & Delivery tab also known as the ‘woodmart additional tab’. I’ve tried with the code below but having some trouble getting it to work.

jQuery('.openTabBtn').on('click', function( e ){
	e.preventDefault();
	jQuery('.woodmart_additional_tab > a').click();
    jQuery([document.documentElement, document.body]).animate({
        scrollTop: jQuery(".woodmart_additional_tab").offset().top
    }, 500);
});

Then adding the link element

<a href="#" class="openTabBtn">Shipping & Delivery</a>

Yes, this code should work. Do you have problems with that? Send us a link to the page where we can see it.

Hi Artem,
Yeah, the code does seem to function but if you replace it with the additional tab it works. Any ideas why it isn’t?

Try to use this one instead

jQuery('.openTabBtn').on('click', function( e ){
	e.preventDefault();
	jQuery('.woodmart_additional_tab_tab > a').click();
    jQuery([document.documentElement, document.body]).animate({
        scrollTop: jQuery(".woocommerce-Tabs-panel--woodmart_additional_tab").offset().top
    }, 500);
});

Worked like a dream thank you.

Can you do the same thing with regards to the above but attach it to a button doing the same just not as just text?

Attachments:

You must be logged in to view attached files.

Add the following CSS classes to that button openTabBtn btn btn-color-primary btn-style-link btn-shape-rectangle btn-size-extra-small

[Author]

Posts