Inserting Javascript Notification jBar after StickyHeader/Header

theweedwizard
(@theweedwizard)

9 years, 6 months ago
I would like to insert the following code right after the sticky-header/header:
```
<script>
$('#notify').click(function() {
  $(this).slideUp().empty();
});

$(function() {
  $('#notify').html('Welcome to the test page!').slideDown();
});
</script>
<div id="notify"></div>
```
Any help? A similar example can be seen here: http://jsfiddle.net/AlienWebguy/Azh4b/

Thanks in advance.
- This topic was modified 9 years, 6 months ago by theweedwizard.
- This topic was modified 9 years, 6 months ago by theweedwizard.

Viewing 8 replies - 1 through 8 (of 8 total)

Menaka S.
(@menakas)

9 years, 6 months ago
Hi,
Add this to your child theme’s functions.php
```
add_action('__after_header' , 'add_my_javascript');
function add_my_javascript() {
    ?>
    <script type="text/javascript">
            YOUR SCRIPT HERE
    </script>
    <?php
}
```
Thread Starter theweedwizard
(@theweedwizard)

9 years, 6 months ago

Hey Menaka,

Thanks for the help. Unfortunately, the snippet doesn’t work.

https://moneroapparel.com if you woudl liek to see

Menaka S.
(@menakas)

9 years, 6 months ago

Hi,
I can see two opening script tags. One in the code I have given and one from yours… Try to make changes to make it single

Thread Starter theweedwizard
(@theweedwizard)

9 years, 6 months ago

I tried that first. It doesn’t make a difference.
Menaka S.
(@menakas)

9 years, 6 months ago
Hi,
The snippet works in that it has added the code after header.
This is what is there on your site. Do remove the extra <script> in the second line.
```
<script type="text/javascript">
    <script>
$('#notify').click(function() {
  $(this).slideUp().empty();
});

$(function() {
  $('#notify').html('Welcome to the test page!').slideDown();
});
</script>
```
If you mean that the script does not do what you intend it to do, it is a different question.
- This reply was modified 9 years, 6 months ago by Menaka S..
Thread Starter theweedwizard
(@theweedwizard)

9 years, 6 months ago

I have it how you requested currently. Still does to seem to hold.
Menaka S.
(@menakas)

9 years, 6 months ago
Hi,
I can see the script added after the header.
If your question is how to make the script work/do what you intend it to do, then please tell what you hope to achieve with this script.
- This reply was modified 9 years, 6 months ago by Menaka S..
Thread Starter theweedwizard
(@theweedwizard)

9 years, 6 months ago
I would liek to add a collapsible div, in this case a javascript notification bar, that says a coupon code, ie, “Enter Coupon Code MENAKA2016 for 1000% off all items”.

My CSS:
```
#notify {
    position:relative;
    width:100%;
    background-color:orange;
    height:50px;
    color:white;
    display:none;
}
```
- This reply was modified 9 years, 6 months ago by theweedwizard.

Viewing 8 replies - 1 through 8 (of 8 total)

The topic ‘Inserting Javascript Notification jBar after StickyHeader/Header’ is closed to new replies.

Tags