Add search option next to nav bar in the header.

Homepage › Community Forums › Epik Theme Support › Add search option next to nav bar in the header.

Tagged: 

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • July 4, 2013 at 8:41 am #5717
    Hashim
    Customer

      Hi there,

      Thank you for offering great support! I’m looking forward to complete the design of my website with your beautiful theme.

      I’ve managed to build the website just the way I want it. There are just three tiny things that I don’t know how to do. If you can help me with those, than my site will be finished!

      1. How do I get the search option next to my navigation menu in the header, like on this site: http://amylynnandrews.com/ Look at what happens when you click on the little magnifying glass! Just beautiful!

      Thank you in advance!

      Sincerely,

      Hashim

      July 4, 2013 at 6:52 pm #5737
      Hashim
      Customer

        Hi there,

        This one seems to be a little difficult. The support of Studiopress couldn’t help me out yet and advised me to request for help through the forum. All suggestions are welcome!

        Thank you!

        Hashim

        July 5, 2013 at 12:02 pm #5743
        Eric
        Customer

          Do you have a link to your site?

          Have you tried adding a custom menu widget to the Header Right Widget area?

          I create awesome sites for awesome people! Contact me if interested – ericsanchez1585@gmail.com

          July 5, 2013 at 1:20 pm #5749
          Hashim
          Customer

            Hi Eric,

            Thank you for responding!

            This the url that leads to my website:

            http://www.laylamajnun.nl

            I also tried the Header Right Widget area. But it places the search box underneath the navigation menu in the header. And I’m really looking for a design like on this site:

            http://www.amylynnandrews.com

            I’m really looking forward to your suggestions.

            Thank you in advance!

            Sincerely,

            Hashim

            July 5, 2013 at 1:30 pm #5750
            Eric
            Customer

              You would still need to add the search widget in the header right widget area….and then you would have to have the widgets float left or right so they are side to side instead of stacking on top of each other.

              If you look around line 744 in your css file you can add float left or right to this – #header .widget….you may need to define a width as well.

              I create awesome sites for awesome people! Contact me if interested – ericsanchez1585@gmail.com

              July 6, 2013 at 7:46 am #5759
              Hashim
              Customer

                Dear Eric,

                Thank you for your suggestions!

                I’ve been playing around with the float and width functions of #header.widget but unfortunately that doesn’t provide the outcome I’m looking for. Somehow the float function only effects the navigation menu and I can’t seem to find the proper place to adjust the widths of the navigation menu or search menu. When I try to define a width for #header.widget it stacks the elements on top of each other, except when I use 50% as the width. But you can see for yourself what the outcome is:

                http://www.laylamajnun.nl

                and the difference with:

                http://www.amylynnandrews.com

                I’ve received this answer from the StudioPress Community Forums:

                ‘That’s called Search Toggle or Toggle Search – here’s instructions – http://jackwhiting.co.uk/2012/toggle-a-search-box-with-jquery/#.’

                But on the suggested webpage it’s mentioned that it’s necessary to add html. Do I really have to make the changes in the header.php document of the Genesis theme or is there another way to do this?

                Thank you in advance!

                Sincerely,

                Hashim

                July 6, 2013 at 11:20 pm #5766
                Eric
                Customer

                  The link doesn’t seem to be working….so I’m not sure what it said or what they recommend. But if that’s the only way to do it, then I guess you’d have to. You can also just copy the header.php file and place it in your child theme and it should override the file in the Genesis framework.

                  I’ve never done what you’re trying to do, so I’m not really sure the best way. The only way I can think of is the one I suggested earlier, except you’d need to add “float: right” so everything floats to the right…or you could add a width the widget area section and it won’t go all the way over towards the logo area like it is now.

                  I think it would be best to just contact the person of that site and ask how they did it since they appear to be using the Epik theme. I don’t know who this person is or whether they’ll tell you or not, but its worth a try.

                  I create awesome sites for awesome people! Contact me if interested – ericsanchez1585@gmail.com

                  July 11, 2013 at 9:26 am #5832
                  Hashim
                  Customer

                    Dear Eric,

                    Thank you for trying to help!

                    I contacted the owner of the website about the non-working link. And his site underwent a design change, so he moved his post. The correct URL to the post I mentioned is:

                    http://jackabox.co.uk/blog/toggle-a-search-box-with-jquery

                    Also Anitac of the StudioPress Community Forums mentioned that Wes who designed the Epik theme should be able to tell me where to place the code of the post I mentioned. But maybe you can also.

                    Thank you in advance!

                    Sincerely,

                    Hashim

                  • Author
                    Posts
                  Viewing 8 posts - 1 through 8 (of 8 total)
                  • You must be logged in to reply to this topic.