Twitter Widget only working on menu click! [ twttr.widgets.load() ]

Hi! I’m trying to build an app for my high school. Site: www.appsinc.tk

Problem: The widget works, but I can’t find out how to initialize the twitter widget on the twitter page immediately!

The script part of the Twitter embed code is in index.html in the head tags while the embed part is in twitterpage.html

I was playing around with where to put twttr.widgets.load() and when I put it in controllers.js

.controller('ThreeController', function ($scope) {
    $scope.navTitle = "Twitter"
    $scope.leftButtons = [{
        type: 'button-icon icon ion-navicon',
        
        tap: function(e) {
        	
            $scope.sideMenuController.toggleLeft();
             twttr.widgets.load()
        }
        
        
        
    }];

I got it to load, but only after you click the Twitter page, then click the menu. This obviously is not good enough. I’m a complete beginner to web development and I think this is a painfully simple question for most of you! Thanks in advance for all help!

This is the project I based it on. The file structure is the same:

Relevant files

index.html: http://codeshare.io/AFvJQ

controllers.js: http://codeshare.io/vvs0u

twitterpage.html: http://codeshare.io/guGvk

app.js: http://codeshare.io/TbV0o

why dont you put it all back together into one CodePen so we can all take a look?

1 Like

I’m going through your source code on the actual app. I can’t find twitterpage.html anywhere.

FYI: Those CodeShare links are buggy as all get out. I can’t load more than one at a time without my browser crashing. Try putting this up in CodePen and we’ll see what we can do to help.