Installation

Instructions

Installation
Include your favorite jQuery version, but at least 1.8.0.

then write:

<script src="https://cdnjs.cloudflare.com/ajax/libs/ajaxify/6.5.6/ajaxify.min.js" type="text/javascript"></script>

OR

<script src="http://4nf.org/ajaxify.min.js" type="text/javascript"></script>

OR

<script src="http://mysite.com/ajaxify.min.js" type="text/javascript"></script>

… in the head. Then, include the plugin as described on interface.

Google Analytics Setup

The plugin manages informing GA “out of the box”.

Therefore, in order to avoid registering double PageViews, please comment out or delete the following line in the universal GA code stub:

//ga('send', 'pageview');

 

34 thoughts on “Installation”

  1. Hi,

    I just learnt about ajaxify and I’m very excited. The problem is I have read the notes but failed to implement ajaxify on my website completely. All links call a form submit method that executes a cgi script, after trying what I read I still get entire page refresh. Please Log onto http://www.cloudpos.co.nr/ and use the following login details:

    Email: rchinovhiringa@gmail.com
    Password: admin

    I really need to ajaxify the project because bandwidth is bad here in 3rd-world countries.

    Thanks

    Roland

    1. Hi Roland!

      Thanks for your interest in Ajaxify.
      I’ll get back to you on Friday and have a look at your case…
      If you would like to reduce bandwidth, it is probably advisable to set:

      prefetch: false

      (before I forget)

      Concerning the central form submit method, it may be, that Ajaxify, in its current form, is not capable of handling it…

      Regards

      1. Hi Roland!

        I had a look, thanks for the details…
        Could not see, that Ajaxify is being loaded.

        Also, you’re using frames, right?
        That might be a problem, too…

        Thanks and
        Regards

  2. I’m currently using an old “ajxify” like plugin, pagify.js but would like to use yours. I’m not sure how you set up the links to load html pages into the set div using ajaxify. Pagify uses and id like structure ( href=”#page” points to page.html) I find setting the href to page.html using ajaxify, does not load the page into the set div. I am seeing the log indicate that ajaxify is loaded but it say it can’t find the page. An example of setting up links would be helpful. Any idea why the page won’t load?

    1. Thanks for your interest in this Ajaxify variant.

      You can specify:

      – The links to be “sensitive” in the selector property
      – The divs to be swapped each time within the jQuery selector

      Summing it up -> something like this:

      jQuery('#main').ajaxify({selector: '.ajaxy'});

      …would swap the two selected divs and ajaxify all links with the class “ajaxy”

      Hope that helps – please do ask again, if you’re unsure!

      Thanks!

      1. Thanks for the help but still not working. I get “Error in _request : Not Found ajaxify.min.js:1:2656” in the console when I set top my link like this:
        Emergency, where emergency.html is at the same level as index.html and has the div #main in it. Do links have to be absolute to work?

        1. sorry, didn’t realize the html of the link wouldn’t show. the link has an href=”emergency.html” and is at the same level as the index.html and has the div id #main

          1. Hi Mike,

            Just visited your site and it seems to be working (the sub-page “emergency”)?
            I cannot see the error you described?

          2. Thanks for the feedback. I uploaded the files without cleaning up the html. Should be fixed now. Ajaxify seems to work on all page loads except one with an iframe (chips.html). The other issue, which may be my coding, is that index.js does not function in the loaded pages. Should that script be just in the index page only or in each of the loaded pages?

          3. Hi Mike,

            thanks for persevering with your tests!

            Just very briefly – if you’d like a simple fade, please specify:

            aniTime: 400 // or the milliseconds, you’d like

            I’d love to include your site on the demos page, if you succeed in procuring Ajaxify and with your consent!

            EDIT: Yes, you have to include Ajaxify on all sub-pages, in case the user jumps into a sub-page directly…
            Also, the plugin call on each page ought to be identical!

  3. Tags is
    a tag == a href tag
    b tag == bold tag
    strong == bold tag
    header == html5 header tag
    footer == html5 footer tag
    section == html5 section tag

    sorry for multiple comments.

    It was due to WP.

    please those TAGS comment.

  4. jQuery(β€˜.col-md-8’).ajaxify();

    it didn’t work because it switch same content to other page.

    so .col-md-8 not content but whole page switch to them.

    Please guide me.

    But in demo here only selected content div changes πŸ™‚

    1. Hi Tom,

      as mentioned before – the selection hast to be a content div ID, e.g.

      jQuery(β€˜#maincontent’).ajaxify();

      Please fix that first!

      1. How to use it?

        I tried docs not works.

        It load same content but title only change πŸ™

        jQuery(‘aside’).ajaxify();

        it return all content to other pages.

        is there a way to load only 1 element content like this site do?

        2nd. i don’t to load content on Mouseover πŸ™‚

        1. Hi Tom,

          an ID of a content div is expected in the selector: jQuery(β€˜#aside’).ajaxify();
          By default preview is turned off…

        2. There’s no error in console. No error in javascript execution.
          I don’t think is due to any js errors, i think there is some action that inhibit touch on iOS when you open a link by ajaxify.

          1. Hi Andrea,

            thanks for posting back! I unfortunately don’t have an iOS device, but a friend of mine does…
            Do you think it applies to the “Mac”, too? Or just devices with a touchscreen?

            EDIT: You could try setting prefetch: false because you have memoryoff: true set, too!

            Thanks again!

        1. Sure.
          I have some links in display:block, each link point to an article (see on bebeap.com home page). On an iPad, when I tap one article link, the article appears in the third column.
          When you try to scroll the page with the finger on the opened link, the page won’t scroll. Never.
          Now I’ve updated ajaxify plugin, so you can see the issue on my site, http://www.bebeap.com.

          Thank you very much.

          1. Hey Andrea,

            Thanks for the link to the test page. Very useful, nice site!
            Unfortunately, I don’t have an iPad for debugging.
            Do you think it is specific to the iPad?
            Just briefly cruised your site with Chrome and could neither see an error nor a warning.

            Maybe you’ve sorted it out in the meantime.

            What I noticed though, is that there is only one instance of display:block on the entire homepage?

            It would be great to pinpoint the error in e.g. the Chrome/Firefox console?

            Thanks!

Leave a Reply

Your email address will not be published. Required fields are marked *

Copyright 2005-2016, 4nf.org. All rights reserved.
Latest update: 17. November 2016