Jump to content

Archived

This topic is now archived and is closed to further replies.

ketri

Something in DMS is preventing a jQuery -based section from working

Recommended Posts

ketri

I'm trying to create an instagram widget section.
It's based on https://github.com/pavelk2/social-feed
Demo: http://pavelk2.github.io/social-feed/

Here is my section.php code (it's formatted so you can just create a new section and copy-paste it - all .js etc are loaded from external page for simplification)
 

<?php
/*
Section: social feed
Author: Ketri
Author URI: http://petripottonen.com
Description: Just trying stuff
Class Name: socialFeed
Workswith: templates, main, header, morefoot, content
Cloning: true
Filter: component
Loading: refresh
*/

/*
 * Main section class
 *
 * @package PageLines DMS
 * @author PageLines
 */
class socialFeed extends PageLinesSection {
 function section_styles(){
        // This will load the 'cooljavascript.js' file from the current section folder
       // wp_enqueue_script( 'doT.min.js', $this->base_url.'/doT.min.js', array( 'jquery' ), PL_CORE_VERSION, true );
       // wp_enqueue_script( 'moment', $this->base_url.'/moment.js', array( 'jquery' ), PL_CORE_VERSION, true );
       // wp_enqueue_script( 'socialfeed', $this->base_url.'/jquery.socialfeed.js', array( 'jquery' ), PL_CORE_VERSION, true );
    }

/**
* Section template.
*/

   function section_template() {
    $categoryName = $this->opt( 'pagelines_categoryloop_category', $this->tset );
$numberOfPosts = $this->opt( 'pagelines_herounit_tagline', $this->tset );
$catOrCMP = $this->opt( 'herounit_category_or_cpt', $this->tset );
?>
        <div class="social-feed-container"></div>

    <!-- doT.js for rendering templates and moment.js for showing time ago -->
    <!--<script src="dependencies/doT.min.js"></script>
    <script src="dependencies/moment.min.js"></script>
  
    <script src="js/jquery.socialfeed.js"></script>-->


    <script src="http://petripottonen.com/social-feed2/dependencies/doT.min.js"></script>
    <script src="http://petripottonen.com/social-feed2/dependencies/moment.min.js"></script>
    <script src="http://petripottonen.com/social-feed2/js/jquery.socialfeed.js"></script>
    

    <script>
    jQuery(document).ready(function(){
        jQuery('.social-feed-container').socialfeed({
                    //FACEBOOK--------------------
                    facebook:{
                        accounts:['teslamotors'], //usernames or id
                        limit:2,
                        token:'240696342763428|FgHgjfn7wWMNT15ONHP0tVdWm_k' //you can also create an app and put  here your 'APP ID|APP SECRET' - it is easier but not safe
                    },
                    //VK--------------------
                    vk:{
                        accounts:[125936523], //id for users and -id (with minus) for groups 
                        limit:2,
                        source:'all'
                    },
                    //GOOGLEPLUS-------------------
                    google:{
                         access_token: 'AIzaSyA_lDYGTnTiEjhzjvkxX1KZnouhbVQ0QUU', //AIzaSyA_lDYGTnTiEjhzjvkxX1KZnouhbVQ0QUU
                         accounts: ['111435337725041517235','114461178896543099856','+TeslaMotors'],
                         limit: 2
                     },
                    //INSTAGRAM---------------------
                    instagram:{
                        accounts:[297604134], //userid
                        client_id:'2c6d2173ae9d41de905236e6301e5a43', //2c6d2173ae9d41de905236e6301e5a43
                        limit:2
                    },
                    //GENERAL SETTINGS--------------
                    length:130,
                    show_media:true,
                    callback: function(){
                        console.log('all posts are collected');
                    }
                });
});
</script>
    
<?php 


}


}

 

 

It does not work.

BUT the strange thing is, that if I copy-paste the functional part of the code to a blank -html -file, it works. 
In fact, even if I copy paste the entire code that shows in my DMS, the whole thing and copy-paste it to a blank .html, the section then works! 
What could be the problem?

Thank you. 

Share this post


Link to post
Share on other sites
Simon

1. please dont post huge bits of code in the forum, it doesnt render it at all well, use a gist, pastebin, or even the pastebin here on the forum

2. please give us a url where this section is installed so we can see whatever error it is producing

Share this post


Link to post
Share on other sites

  • Similar Content

    • sakkthi subramaniyam
      By sakkthi subramaniyam
      Working on a very old site which has  pagelines framework theme. I need section plugin. so i can install postpins section. I have lost backup copy.
      Thank you.
    • elementalkites
      By elementalkites+
      Good evening. I am attempting to use the Impulse section on a page I am working on (https://dev.elementalkites.com). The tool seems to have the ability to overlay a logo on top of the slider images but in my case it isn't working, even though I have added the logo file and given it a height to display at. I have attached a screenshot for reference. Any help would be appreciated.
       
       
    • cas45
      By cas45+
      I am running a site based on PageLines Framework 2.5.0. I am making some changes to a current website and managed to find a script that will do what I want.:
       
      $(".vend-cat").each( function() {
          if ( $(this).find(".no-vendors").html() == '' ) {
                 $(this).hide();
          }
      } );
       
      I have tested it on jsfiddle and it works fine. It does however need to be adapted to work with jQuery for pagelines and wordpress. Any help or advice?
       
      Thanks
    • jojoking
      By jojoking+
      I have to admit to being baffled.
      I'm trying to embed a video (from my WP media library) within a WP post using the videobox section shortcode.
      The shortcode section popup only allows two items to be configured - the section type, in this case videobox - and a unique id. There's no URL or other parameters such as autoplay or loop which are available within the Pagelines editor.
      Whatever I put in the unique ID makes no difference to what is shown which seems to be a default video with stars or white noise on a black background.
      I assume I need to define this ID somewhere else, or maybe WP has done it for me?
      HELP!
       
      PS This is the page source generated when a shortcode is added within the WP post editor
      <!-- VideoBox | Section --> <section id="videobox_1675853156" class="pl-sn pl-col-sm-12 pl-col-sm-offset-0 pl-sn-videobox" data-object="PL_VideoBox" data-clone="1675853156" data-level="0"><div class="pl-sn-wrap"><div class="pl-sn-pad fix" data-bind="pledit: true" > <div class="video-highlight"><h3 class="video-title" data-bind="pltext: vb_title"></h3></div> <div class="pl-video-box" data-bind="plcallback: { vb_autoplay: vb_autoplay(), vb_loop: vb_loop(), vb_controls: vb_controls(), vb_video: vb_video()}" data-callback="videobox"> <video id="280414138" autoplay loop > <source src="https://www.handinhandmanchester.org.uk/wp-content/plugins/pl-section-videobox/default.mp4?r=280414138" type="video/mp4" /> No browser html5 video. </video> <script> jQuery('#280414138')[0].load(); </script> </div> </div></div></section> </div>  
      If I add a videobox section using the Pagelines page editor the page source generated includes my video:
      <!-- VideoBox | Section --> <section id="videobox_udvu4uz" class="pl-sn pl-col-sm-12 pl-col-sm-offset-0 pl-sn-videobox" data-object="PL_VideoBox" data-clone="udvu4uz" data-level="0"><div class="pl-sn-wrap"><div class="pl-sn-pad fix" data-bind="pledit: true" > <div class="video-highlight"><h3 class="video-title" data-bind="pltext: vb_title"></h3></div> <div class="pl-video-box" data-bind="plcallback: { vb_autoplay: vb_autoplay(), vb_loop: vb_loop(), vb_controls: vb_controls(), vb_video: vb_video()}" data-callback="videobox"> <video id="429558737" autoplay loop > <source src="https://www.handinhandmanchester.org.uk/wp-content/uploads/2017/04/HIHWelcome.mp4?r=429558737" type="video/mp4" /> No browser html5 video. </video> <script> jQuery('#429558737')[0].load(); </script> </div> </div></div></section>  
    • unifeyed
      By unifeyed+
      Hello there. 
      I am trying to have all the ® symbols throughout my website superscript without having to individually go to each symbol and wrap them in <sup> tags. There is quite a bit of them. I have the following code within the Custom Scripts, but it seems to cause issues with the Hamburger navigation, as it does not seem to work. Can you offer up some assistance? 

      <script>
      jQuery(document).ready(function() {
                 jQuery("body").html(
          jQuery("body").html().replace(/®/gi, '<sup>®</sup>').replace(/®/gi, '<sup>®</sup>')
         );
              });
      </script>
×