How do you add shrink effect on your site header?

One of my GBeaver theme’s customer asked this effect. I am sharing the tips here. So it will help my other customers also.

Step 1: Login to Dashboard and go to GBeaver Theme options page. Expand the General Settings section and enable the “Sticky Header” effect.

Step 2: Open the style.css file and add this new CSS

Step 3: Create a new JS file “shrink-header.js” and put into assets/js folder. Here is the full code of this JS file:

Step 4: Open the functions.php file and add this PHP code

Reader Interactions

Leave A Reply