Call To Action Button Issue

caseyclement
(@caseyclement)

9 years, 4 months ago

Hi,

I need some help with the header section of the Sydney theme. I moved my call to action button down, and inserted a logo into the header using the “header and footer scripts” plugin. After inserting the image into the header, it acted as if something were blocking the CTA button, because it is only clickable on the bottom half of the button. Here are the 2 bits of code I used:

Header:

<style type=”text/css”>
.slide-logo-wrap{
position: absolute;
top: -100px;
left: 0;
width: 100%;
height: 100%;
z-index: 9999;
text-align: center;
}

.slide-logo{
display: table;
position: relative;
width: 100%;
height: 100%;
}

.slide-logo div{
display: table-cell;
vertical-align: middle;
position: relative;
}

.slide-logo a{
padding: 10px 10px;
}
</style>

Footer:

<script type=”text/javascript”>
(function($){

if( $(‘.header-slider’).length ){

var siteURL = ‘http://witsae.com’;
var siteName = ‘WIT SAE’;
var logoImg = ‘https://image.ibb.co/hxfWJv/SAE_Type_Site_1_01.png’;
var logoObj = ‘<div class=”slide-logo-wrap”><div class=”slide-logo”><div></div></div></div>’;

$(‘.header-slider’).append(logoObj);

}

})(jQuery);
</script>

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

Kharis Sulistiyono
(@kharisblank)

9 years, 4 months ago
Hello there,

Try to replace your jQuery code with this one:
```
<script type="text/javascript">
  (function($){

    if( $('.header-slider').length ){

      var siteURL  = 'http://witsae.com';
      var siteName = 'WIT SAE';
      var logoImg  = 'https://image.ibb.co/hxfWJv/SAE_Type_Site_1_01.png';
      var logoObj  = '<div class="slide-logo-wrap"><div class="slide-logo"><div>'+siteName+'</div></div></div>';

      $('.slide-item .slide-inner').append(logoObj);

    }

  })(jQuery);
</script>
```
Let me know how it goes.

Regards,
Kharis
Thread Starter caseyclement
(@caseyclement)

9 years, 4 months ago

Hi Kharis,

The CTA button works now, but my image disappeared! All that is showing now is the image name in it’s place.

Kharis Sulistiyono
(@kharisblank)

9 years, 4 months ago

Hello there,

Thank you for updating me. Please share your site URL here, so I can inspect what have gone wrong.

Regards,
Kharis

Thread Starter caseyclement
(@caseyclement)

9 years, 4 months ago

http://witsae.com/
Kharis Sulistiyono
(@kharisblank)

9 years, 4 months ago
Hello there,

Thank you for sharing. I just found some error in my code. Sorry. Try to replace it with this one:
```
<script type="text/javascript">
  (function($){

    if( $('.header-slider').length ){

      var siteURL  = 'http://witsae.com';
      var siteName = 'WIT SAE';
      var logoImg  = 'https://image.ibb.co/hxfWJv/SAE_Type_Site_1_01.png';
      var logoObj  = '<div class="slide-logo-wrap"><div class="slide-logo">';
      logoObj     += '<a href=""><img src="'+logoImg+'" alt="'+siteName+'" /></a>';
      logoObj     += '</div></div>';

      $('.slide-item .slide-inner').append(logoObj);

    }

  })(jQuery);
</script>
```
Regards,
Kharis
Thread Starter caseyclement
(@caseyclement)

9 years, 4 months ago

Works perfectly now, thanks!

Kharis Sulistiyono
(@kharisblank)

9 years, 4 months ago

You’re welcome!

Please let us know in a new topic if you have any further questions, or if we can provide you with any other assistance.

Regards,
Kharis

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

The topic ‘Call To Action Button Issue’ is closed to new replies.