Placing Homepage Search (General Wide) into main-menu div...

[Brian Jester]

Hello,

What ever I am doing wrong seems very basic, but I am close to getting it...Just getting really frustrated with it! Can someone check out my header template and fix it, before I blow a circuit?

The output I am trying to get is the search with category menu, and search button in the current spot as in my template. Maybe it's my css, but I didn't do too much changes so I doubt it, but you can see that too. I have attached a zip file that includes my header.tpl and style.css file along with the current output screenshot of the search. The screen shot only shows the search not the whole header, but the tpl should explain better as I spaced the header.tpl so it's easy to read.

Also, if there is a simpler way of achieving what I am trying to get (like using a smarty template includes for example) can you explain to me how to do it? I have tried numerous ways, including from the smarty website.

Maybe I am over-thinking something so simple, but I ran out of thoughts

Thank you in advance!
Brian

[Rudi]

Hello,

You changed location of the search box moving it from 'horizontal-search' container to 'header'
but the path to categories field in selector still refers to 'horizontal-search' container which is empty:

Only registered members can view the code.

highlithed code.jpg

also you didn't copied code completely from 'horizontal-search' container
(see attached screenshot 'highlighted code' what code should be copied)

categories selector.jpg

So, you should
move search box completely including 'horizontal-search' container
or
copy only the code that highlighted on the screenshot and wrap it with some container like:

Only registered members can view the code.

in this case change categories selector to:

Only registered members can view the code.

analogically change the value for search by distance block, see on the screenshot

[Brian Jester]

Edit: Solved! I floated my top-navigation to the right, and the page looks normal again!

Thanks again Rudi!


Hello Rudi,

Thank you for your help, Rudi! I might have removed a div from my page as the side boxes are not correct. I think I am missing a closing div or something else. Think you can spot it in my code?

Here's my header.tpl:

Only registered members can view the code.

side boxes out of alignment screenshot:
screenshot-localhost-2017-12-07-18-42-37.jpg

Thank you in advance!
Brian

[Brian Jester]

Hello Rudi,

If you don't mind I have one more question for tonight on this topic...I have tightened up my header, and this is what I have so far, mainly just adding my logo and possiblly a couple of pages to the top menu should complete it, but the problem this time is only when I scroll down the page, the search 'jumps' out of the original location and goes below its original spot in the section.content._block.listings_box div. This is on the homepage and the search-on-map.html page, so I am guessing it has only to do with the fixed header, but I can't fix it. Any ideas?

UPDATE: Here is a screencast (video) showing how the search box gets 'pushed' out of the div. Sorry for the file size, I uploaded to a free file host:

https://nofile.io/f/OVPPYjP5pzc/Scre...:28:09.mp4.zip

Only registered members can view the code.

Thank you again!
Brian

[Rudi]

Hello Brian,

1. There are no closed tags for:

Only registered members can view the code.

2. The video of the search box problem is empty

[Brian Jester]

Hello Brian,

1. There are no closed tags for:

Only registered members can view the code.

2. The video of the search box problem is empty

Hello Rudi,

Can you tell me where to put the closing tags, and do you mean the video doesn't play?

Here's another link to the video in case it didn't play:
https://www.dropbox.com/s/3sfqzbn7hi...9.mp4.zip?dl=0
Brian

[Rudi]

Hello,

1. I've checked your code again and haven't found anything wrong
2. Your video of 197 Kb still can't be played in my player, try to send some screenshots

[Brian Jester]

Rudi,

As for your previous post, what do you mean that there was not closing tag for:

section class="horizontal-search{if $aHooks.search_by_distance} sbd-exists{/if}">
<div class="point1">

?

As for the video, maybe try vlc media player on windows, but I am using linux and it plays just fine with Totem Movie Player for Ubuntu 16.04.

Here's a couple of screen shots you can see where the problem is:

First screen shows the header without scrolling.
Second screen shows the header WITH SCROLLING to the fixed view of the header

Screenshots labeled ss1 & ss2:
ss1.jpgss2.jpg

Also, is there a smarty template variable that will allow me to use the {include file='home_content.tpl'} instead of pasting the entire content of the home_content.tpl file into the header.tpl file? I tried the include statement into the header.tpl inside the menu div, but it came up blank, the search didn't appear using that code. Is there a way to make it work that way so I can shorten the amount of code in my header.tpl file?

Brian

[Rudi]

Hello Brian,

1. it was my mistake, everything seems to be correct, maybe some css styles should be changed
2. try to change search box size via css styles in style.css

[Brian Jester]

Hello Rudi,

After restoring my general wide template, I have been trying to get this all figured out, but I still need some help. I have the header *almost* complete, but I need to know a couple of more things.

1. In the 'normal view' before scrolling down the page, my header needs to be adjusted (positioned) but if I adjust the horizontal search the 'fixed' menu also gets moved (out of place) how can I adjust one without the other so my search bar sits correctly in both normal and fixed positions?
2. Regarding the Post ad Button, is there a include statement to just put the button or is that only for the entire main menu? I just want the button next to the search but it's not aligning correctly. Maybe easier to just make my own, without the main_menu.tpl?