Archived

This topic is now archived and is closed to further replies.

  • 0

Contact Form With Exact Same Styling As The Native Leave A Reply Form?


Question

Posted · Report post

Hi all,

 

I'm trying to create a Contact Me form whose styling is exactly the same as the default "Leave a Reply" form in the Pagelines framework.

I can really tell where to start.  I experimented with cforms, but I couldn't get the styles to match.

 

Is there a reasonably simply way of doing this?

 

Thanks,

Trevor

1 person likes this

Share this post


Link to post
Share on other sites

10 answers to this question

Posted · Report post

Hi Trevor

 

Pagelines now has inbuilt styling for forms, the 'leave a reply' form is simply a title and a text area. What are you looking to put on your form? When you say want the styling exactly the same, are we talking the same font, size, etc.

 

I always use contact form 7 for forms, you can override form styles using css. Let us know exactly what you're looking for and we'll try to advise further.

2 people like this

Share this post


Link to post
Share on other sites

Posted · Report post

Hi James and thanks for the reply.

 

I would like to create a simple Contact Me page with fields for name, email, and message (and a captcha) with the styling of that form looking precisely like the Leave a Reply form on any given post.  Is that possible?

 

Cheers,

Trevor

1 person likes this

Share this post


Link to post
Share on other sites

Posted · Report post

Hi Danny,

 

Grunion looks pretty good, and just needs two tweaks that I can see (header styling, and text entry box background colour).  Where can I find these elements in Pagelines so that I can copy them to Grunion?

 

Also, back to James for a sec - how can I use Pagelines in-built forms generator to make a simple form on a Contact Me page?

 

Many thanks,

Trevor

1 person likes this

Share this post


Link to post
Share on other sites

Posted · Report post

Thanks everyone - I'm trying to avoid going under the hood with CSS (I'm on a content schedule), so I'm using the defaults in Contact Form 7 for the moment.

 

If someone can give n00b-simple instructions on changing the form's font styling and text box background I'd be grateful!!

1 person likes this

Share this post


Link to post
Share on other sites

Posted · Report post

The fastest way to deal with the CSS is to use Firebug.  On the left side of Firebug there's a small rectangle with a cursor arrow in the icon.  Point your real cursor to that icon, then to the place you want to inspect and the CSS elements will show up on the right column of Firebug.  You can use it as a sandbox to test changes which you'll see live in your browser.

 

I'd recommend spending a bit of time at www.w3schools.org/css to learn the options you have for CSS. Everything is there, including samples and sandboxes where you can test code.

1 person likes this

Share this post


Link to post
Share on other sites

Posted · Report post

Job done! I went with James' suggestion and am using Contact Form 7.
1 person likes this

Share this post


Link to post
Share on other sites

Posted · Report post

Installed Contact Form 7 and while the forms look great and now match the style of our Pagelines site, it seems to have knocked "Boxes" out of the left hand admin menu. The boxes are still there, and links like this still get them: /wp-admin/edit.php?post_type=boxes

 

Has anyone seen this / know of a fix?

 

John

1 person likes this

Share this post


Link to post
Share on other sites

Posted · Report post

John,

 

Please open a topic of your own, with greater explanation and links to non-admin pages.   Thanks.  We'll be happy to help you.

1 person likes this

Share this post


Link to post
Share on other sites
This topic is now closed to further replies.