Change Text and contact form side by side

What code or methods do I use to make the text side by side? I am using the pipeline theme.

Please and thanks

https://es3v7yla23rylj65-46142587048.shopifypreview.com here is the website

1 Like

Hi There!

To do that you have to first create a parent

then create two
with 50% width each and the place the relevant content in each.

Hello, @HewittShophere

Welcome to the Shopify community!
and Thanks for your Good question.

Please share your site URL,
So I will check and provide a solution here.

https://es3v7yla23rylj65-46142587048.shopifypreview.com

Here is the website, and very new to coding

@HewittShophere

Thanks for the store URL.

  1. Go to Online Store->Theme->Edit code
  2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.
@media only screen and (min-width: 769px) {
#contact-us .grid__item div {
    float: left;
    width: 50%;
}
}

hello, will this be added to all the pages/throughout the whole website

or just the page.contact / contact page ( contact us page)

Just want to make sure as I only need it to be side by side for just one page?

:0

@HewittShophere

code apply to only contact page

You’re a life saver thank you!

I added your code but it looks like this can you help?

1 Like

@Muhammad11

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community! :blush:
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

My website is not live yet. It’s in process. I’m using a Minimal theme. I just want to add side by side pattern on the contact page. like contact form should be on left and all the text should be on right.

@Muhammad11

oh i see not an issue please share store preview url

here is the link

https://y30fal36tts828ts-57611878550.shopifypreview.com

@Muhammad11

can you please share contact page code

Here is the code:

{{ page.title }}

{{ page.content }}

{% form ‘contact’ %}

{% if form.posted_successfully? %}

{{ 'contact.form.post_success' | t }}

{% endif %}

{{ form.errors | default_errors }}

{% assign name_attr = ‘contact.form.name’ | t | handle %}
{{ ‘contact.form.name’ | t }}

{{ ‘contact.form.email’ | t }}

{% assign name_attr = ‘contact.form.phone’ | t | handle %}
{{ ‘contact.form.phone’ | t }}

{{ ‘contact.form.message’ | t }}

{% if form.body %}{{ form.body }}{% endif %}

{% endform %}

1 Like

@Muhammad11

Yes, please confirm this look

It’s perfect. You’re a Gem. but can you guide me on how to switch sides too by myself? like if I want the Text on left and Form on right?

can we achieve this layout?

can we make this please?

1 Like

@Muhammad11

yes please change content as per you code we don’t control your admin so please update custom code