JQuery Nivo Slider v2.0 not Showing Up in BlogEngine 2.8

Problem

Actually problems were multiple but, in this blog I will only focus on the Nivo Slider’s integration to BlogEngine.Net. I installed the NivoSlider from the Gallery option of the BlogEngine.Net. The installation was successfull and I could see the NivoSlider in the Installed Extension’s option.

After that I went through their tutorial and without doing any custom modification I wrote the following code in one of my post, more info


[SLIDER:slider1]

After saving the post, I navigated back to the front page. However, nothing appeared except for an edit link. Now, when I checked the Console in my Google Chrome browser, I saw the error that the method LoadSlider is undefined.

Solution

It was clear that the somehow the webpage is not getting the reference of the nivo-slider-js. So to add it’s reference I added the following code inside my theme page body section


<link type="text/css" rel="stylesheet" href="<%=Utils.AbsoluteWebRoot %>Styles/nivo-slider.css" />
<script type="text/javascript" src="<%=Utils.AbsoluteWebRoot %>Scripts/jquery.nivo.slider.pack.js"></script>

Now the slider was showing up in all the posts it had been plugged in.

Note

There’s one more thing I must mention here i.e, if you are integrating NivoSlider 2.0 with BlogEngine 2.8 then the slider may not work properly. The reason is that NivoSlider uses the live method of jQuery and as of jQuery 1.7, the .live() method is deprecated.

To resolve the issue, open the file jquery.nivo.slider.pack and rename the .live() method to .on().
Click here for more info

That’s it!!

Advertisements

8 thoughts on “JQuery Nivo Slider v2.0 not Showing Up in BlogEngine 2.8

  1. website design January 9, 2014 / 05:27

    It’s hard to find knowledgeable people on this topic, but you sound like you know what you’re talking about! Thanks
    website design

    Like

  2. Anonymous March 5, 2014 / 23:51

    I do agree with all the concepts you've offered in your post.
    They're rezlly convincing and can definitely work. Nonetheless, the posts are too brief for starters.
    May just you please extend them a little from subsequent time?

    Thanks foor the post.

    My web-site :: need to build muscle – vietnamlit.org,

    Like

  3. Anonymous April 7, 2014 / 07:52

    my dear friend kindly tell where specifically is the theme page body section located in the BG 2.8 source code. Iam not getting where this code is required to be added

    Like

  4. PIYUSH SINGH April 8, 2014 / 06:59

    See, generally, in asp.net, we include js/css references in the master page so that they will automatically get added to the content pages. Now, in BlogEngine, you'll see that there's a folder, themes, which contain the list of all the themes of your site.

    There, foreach theme, you'll get a site.master page. For ex, if your site is running the theme, BlueLine, add the given code snippet in the body section, preferably at the top, of the site.master of BlueLine.

    Like

  5. Anonymous April 25, 2014 / 07:17

    Thanks dear, it worked fine now!!

    Like

  6. Joesph Considine December 12, 2016 / 12:45

    I really love the way you discuss this kind of topic.~;’.~

    Like

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s