Hi guys, I need some assistance. I'm trying to achieve a layout something pretty similar to: http://ishothim.com/ What I want, describing the user experience, is for someone who enters my site, is for him/her to see an image which is full width and to have, for example, a height of 800 pixel. I don't want/need the image to be static when scrolling down, as the I Shot Him website. Centered I would like to have the Logo and two links. This two links when clicked, should sroll down to the pertinent seccion on the same html. I'm attaching a couple of images where you'll see how I need to customize my Salient theme. Once the user scrolls down, and reached the point shown at homepage-when-scrolling-down-3rd.jpg the menu that has: ES, EN, About, My Account, Featured Products, and the social icons.... should stay fixed at the top, always visible {unless the user scrolls up again to the top where I placed the garden image} CAN YOU PLEASE HELP ME OUT GIVING ME A COUPLE OF TIPS ON HOW TO ACHIEVE THIS? I'm web programmer, so I need to customize the code I can do it. If I DO need to customize a .php file, what I would like, is for you guys to give me a couple of tips on how to set up my homepage (sliders, shortcode, etc) so that it's easier for me to be able to reach this type of layout. Tks in advance!! Best regards Juan Pablo Tort
This definitely is going to take a fair deal of work, but i'm glad to hear you're a developer so I don't s to try and simplify things :)
1. The Nectar Slider already has a fullscreen function so even if you only want to use one image, just use a nectar slider so that it can auto scale to the users screenheight and take care of that aspect.
2. Centering the header links/logo would be done through css mods and the functionality of them scrolling you down the page could be done through a plugin like this: http://wordpress.org/plugins/page-scroll-to-id/ where you just place anchors below the nectar slider in the editor. You can also use this css to stop the main header from being fixed
#header-outer {
position: absolute!important;
}
3. Making the nav under the slider stay fixed once reached would be a javascript effect which you could code in the init.js file. Also, you'll need to make the menu in the header.php file too of course.
Hey Juan!
This definitely is going to take a fair deal of work, but i'm glad to hear you're a developer so I don't s to try and simplify things :)
1. The Nectar Slider already has a fullscreen function so even if you only want to use one image, just use a nectar slider so that it can auto scale to the users screenheight and take care of that aspect.
2. Centering the header links/logo would be done through css mods and the functionality of them scrolling you down the page could be done through a plugin like this: http://wordpress.org/plugins/page-scroll-to-id/ where you just place anchors below the nectar slider in the editor. You can also use this css to stop the main header from being fixed
#header-outer { position: absolute!important; }3. Making the nav under the slider stay fixed once reached would be a javascript effect which you could code in the init.js file. Also, you'll need to make the menu in the header.php file too of course.
Cheers :)