Solved

WordPress Contact Form 7

Posted on 2014-12-26
6
528 Views
Last Modified: 2014-12-29
Hello,

I want to stack horizontally some fields on a WordPress Contact Form 7, but the plugin seems to force a <br /> equivalent after a select element.

Here is the code:

Option 1 (Date / Time): [select Month1 id:wpcf7dm "1" "2" "3" "4" "5" "6" "7" "8" "9" "10" "11" "12"] [select Day1 id:wpcf7dd "1" "2" "3" "4" "5" "6" "7" "8" "9" "10" "11" "12" "13" "14" "15" "16" "17" "18" "19" "20" "21" "22" "23" "24" "25" "26" "27" "28" "29" "30" "31"] <br />

It looks like this: http://rain1.com/new-site/customer-support/service-request/

Is there a way to force the select fields to line up horizontally?

Thanks
0
Comment
Question by:Richard Korts
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
  • 3
6 Comments
 
LVL 29

Expert Comment

by:chilternPC
ID: 40519019
you would have to change the code in the theme-style.php if you want the fields to be horizontal. (i.e remove the <br/> in the code.
but the forms is designed to be responsive so you would need to only change it for the large screen devices
0
 

Author Comment

by:Richard Korts
ID: 40519180
There is no php called theme-style.php in the edit page.

How do I find that?
0
 
LVL 29

Expert Comment

by:chilternPC
ID: 40519199
the location is:
http://rain1.com/new-site/wp-content/themes/bee/functions/theme/theme-style.php
if its not accessible from the online editor, you may have to download the file (back it up ) change it and re-upload it.
- Oh actually looking at this it  just generates  a CSS file so its not the one that adds in the <br/> - that's probably in  the /plugins/contact-7-form/ folder
0
WordPress Tutorial 4: Recommended Plugins

Now that you have WordPress installed, understand the interface, and know how to install new parts, let’s take a look at our recommended plugins.

 

Author Comment

by:Richard Korts
ID: 40519205
chilternPC,

I know a little css; I can see NOTHING in that file that effects form fields; note that the CAPTION of the field is ABOVE the fields; seems there should be an option to place it to the left.

I've pretty much given up on this, I'll post a related question shortly.
0
 

Author Comment

by:Richard Korts
ID: 40519212
I've tried 6 or 7, I think that one too. Drag & Drop doesn't work because of the theme (Bee).

I can't afford to force the customer to another theme now; have to bill more than they would want to pay, have to live with Contact Form 7.
0
 
LVL 29

Accepted Solution

by:
chilternPC earned 500 total points
ID: 40519218
I've just installed contact form 7 and you can edit the contact form!

go to the "Contact" on the left hande menu when you log in, click on the  form menu and click on the name of the contact form you have created.

on the left hand side is the code for your form including the <br/>.
remove the <br/> and the 'newline'  and save  so its like:

[select menu-816 include_blank "one" "two" "three" "four"][select menu-816 include_blank "one" "two" "three" "four"][select menu-816 include_blank "one" "two" "three" "four"]

and save. see example here:

http://goo.gl/uHStNa
0

Featured Post

Salesforce Made Easy to Use

On-screen guidance at the moment of need enables you & your employees to focus on the core, you can now boost your adoption rates swiftly and simply with one easy tool.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

I want to start by talking about the use of plug-ins for WordPress. I started a web-site for a company I was working for a few years ago; I had extremely basic knowledge of HTML. I am a Graphic Designer by trade so I invited the opportunity as a cha…
This article shows the steps required to install WordPress on Azure. Web Apps, Mobile Apps, API Apps, or Functions, in Azure all these run in an App Service plan. WordPress is no exception and requires an App Service Plan and Database to install
The purpose of this video is to demonstrate how to create a Printer Friendly PDF on a WordPress Page. This will be demonstrated using a Windows 8 PC. Tools Used are Photoshop, Awesome Screenshot” Google Chrome Extension, and SmallPDF.com Log…
The purpose of this video is to demonstrate how to properly insert a Vimeo Video into a WordPress site or Blog. This will be demonstrated using a Windows 8 PC. Go to your WordPress login page. This will look like the following: mywebsite.com/wp…

631 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question