Search Form Customization Problems

  • Amy Krauss

    #2448

    I am trying to customize the Graphene search form area of the top bar by replacing it with an email sign-up form. You can view it here: http://tustoria.com/

    Unfortunately, I can’t seem to get the email sign-up form to nudge up to where the search form was. I want it centered horizontally on the top bar just like the search form was.

    I don’t think the size of my email form is causing the issue, because I am using the same email form on the “Contact” page and there are no issues with extra space above the form. I am wondering if the search form has now become an invisible box I can’t populate.

    Any ideas?

    Josh

    #20245

    I can’t get past the “Coming in November” page.

    Mod

    Kenneth John Odle

    #20246

    if the search form has now become an invisible box I can’t populate

    Not sure what you mean by this. The search box is a search box. There are specific codes in the php files that create it. It’s not something you can “populate” with something else. Perhaps you are thinking of an action hook? This is something you can add pretty much anything to, including a form.

    But like Josh, I can’t really see your site, so I can’t really give more specific information.

    Amy Krauss

    #20247

    Sorry about the links folks. I forgot we have the dummy page up until we go live. Try this: http://tustoria.com/contact

    Josh

    #20248

    Same thing…

    “Currently our site is under development and will launch in November, 2011.”

    Mod

    Kenneth John Odle

    #20249

    Still not there…but I found it at http://www.tustoria.com/blog/

    Well, there’s your problem. You’re not enclosing each item in its own element. You are using things like line breaks and inline styling to place your form, and the form is on the next line down from the phone number. Each of these items should be in their own <span> which can then float next to each other, instead of being on separate lines.

    You want to use code in your widget something like this:

    <span id="phonenumber">(646) 504-4446</span>
    <span id="newsletter">
    --form code goes here without inline styling--
    </span>

    and in your CSS, include

    #phonenumber {float:right; additional styling elements, etc;}
    #newsletter {float:right; additional styling elements, etc;}

    You’ll need to play around with it some, but this should get you on the right track.

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.