Twitter Widget Creation not working - javascript

I'm following the instructions at https://dev.twitter.com/docs/embedded-timelines#customization, but after I make the widget I get data-widget-id="". There's no widget ID at all, and it can't load anything. I've tried making different kinds of widgets as well but all of them have a blank ID.

I'm seeing the same issue. I created a couple of Twitter widgets two days ago, but suddenly, the generated code for all of my widgets shows: data-widget-id="".
Until Twitter fixes this, the workaround is to get the id from the URL on the page where you create the widget. It's the long number in the URL: (eg: twitter.com/settings/widgets/[this-number-is-the-widget-id]/edit?focus_textarea=1&notice=WIDGET_CREATED)

Related

Linking to an ID inside a Bootstrap nav-tab

We are using Bootstrap nav-tabs on our new website's events pages to create different sections on a single page related to our events — About, Speakers, Travel, Register and so on.
Our events coordinator would like to be able to link directly to the individual speakers who appear on the Speakers tab from outside the website. Normally, this is pretty simple — http://domain.name/events/eventspage#speakerID.
However, because we're using nav-tabs, there isn't an easy and obvious way of creating this link. I've looked through posts here and elsewhere to see if anyone else has addressed this problem, but have yet to find anything.
The site was built using Bootstrap 3 and uses ExpressionEngine 2.10 as the CMS.
You can view a working example of how our events pages are set up at https://www.rjionline.org/events/rjicollab.
Any suggestions would be appreciated.
This is how it can work with jQuery:
Select an anchor within a JQUERY Tab from a link on anther webpage
You can adapt the code from there.
Here you can try this function:
function goToTab(){
var hash=document.location.hash,
prefix="tab_";
if(hash)
$('.nav-tabs a[href='+hash.replace(prefix,"")+']').tab('show')
};

How can I search across all pages on my website

I have a search plugin that is more like a filter within a page (it's Swiftfilter and isotope filter). But I want the search to include all the pages on my website.
For example :
I am doing a travel website. When people search on index.html for "Italy". I want the search result directly link to italy.html page.
How can I do that?
What does this call?
Where can I learn/get this plugin?
Can swiftfilter or isotope filter enhance this?
Your problem can get a bit complicated. I'm afraid it's not a simple as finding a single plugin that can do this. It sounds to me like you have a static website, where content is stored across different, hard-coded pages. A static website can get complicated because number one, it would be slow/clunky to search hard-coded files on a website. Number two, you would have to deal with caching systems to speed it up.
If you want to implement a search feature, I suggest that you have a template-driven/database enabled website instead. Why don't you consider moving your site and all its pages over to something like Wordpress?
All your pages would get stored in a database and WP already has its own built-in search functionality. It works really well and I think you should consider it if you have a lot of pages on your website.

Mottie jQuery Tablesorter filters not loading on the page

I'm having a terrible hard time at trying to get the Mottie Tablesorter plugin to work properly on my HTML page.
I'm designing the front end of a website for someone, and I need the advanced filters provided with this plugin:
http://mottie.github.io/tablesorter/docs/example-widget-filter-formatter-1.html#demo
I have downloaded the files in .zip format, extracted them and placed them in my project, and made sure all the links work properly and that the page can read them.
I have copy/pasted the stuff from the demo with the multiple types of filters across all the columns (in the code quotes) into my HTML page.
However, the second table header row inside the table header doesn't appear.
I can't figure out what it is that I'm doing wrong.
Here's a screenshot of what gets rendered on the page + the offending code inside the web inspector of Safari: http://puu.sh/dqzNX.png
As you can see, the second table header looks like it is trying to display, but it's empty?
And it seems like it generates a search for searching by text, but is set to hidden (I don't know why)
And it also generates the correct amount of TH's, but all of them (apart from the first one) are empty!!
I've been banging my head against a wall over this for 4 days now and have no clue!
Can anyone else get this demo to work properly?
Many thanks for taking the time to read all of this!
Looks like I must not have been pulling jQuery UI into my project properly, as when I started from scratch it all looks like it's working now! -- My bad, thanks for the help though, great table filtering!
In my haste I also seemed to have put a css CDN into a script src tag, causing some style errors where the date picker was below the table before it had been selected and had a transparent background. That had me stumped for a good 20 minutes until I realised my mistake!

Social Media JavaScript (buttons) not getting along Google+, Facebook, YouTube etc

I built a quotation mashup. I added a bunch of social sharing buttons. It worked.
I decide to add Google+ and it does not get along with the other JavaScript / HTML. So I commented out all the other social sharing buttons and the Google+ button still doesn't work. Then I try a different quotation, one without a YouTube video it works, one with a YouTube video does not show a Google+ button. That is what I have discovered.
Switching YouTube display code does help, but Facebook like doesn't seem to work now, but Facebook Share does and I'm not 100% sold on my OpenGraph and thus Google+ meta data. Facebook updated their button recently and now I find 'Share' works better than 'Like'. Both can be tracked in Google Analytics in theory. I would like the quotation to appear in the description, that was working for Facebook but I can't get that to happen on Google+. Perhaps I need more meta data. I changed to og:type article that seems to help.
Quotation Collection
Quotation with Video
Quotation with no YouTube Video
I use PHP to build the JavaScript but the Google+ button as far as I can tell gets everything from the metadata. There also might be something wrong with my metadata as I don't do it as cleanly as I do on this page I've revised much of my meta data to try and get my shares to look their best. I need last.fm to provide bigger images or to revisit what I can get out of the wikipedia.
I got all four buttons well 5 social sharing buttons working on my blog, but I used two plugins, the Pinterest button is probably not tracked by Google Analytics but the other four are. I'm pretty sure I almost had it working last night, scarily the li tag seems to make a difference if you use divs and a bunch of CSS it seems to work better than using a list with one button in each item.
<!-- Professional Share Plugin--><div class="ProfessionalShareBox"><div class="PSBtn"><script type="IN/Share" data-counter="right" data-showzero="true" data-onsuccess="LinkedInShare"></script></div><div class="PSBtn"></div><div class="PSBtn"><div class="g-plusone" data-size="medium"></div></div><div class="PSBtn"><div class="fb-like" data-href="http://blog.muschamp.ca/2013/11/24/back-from-mexico/" data-send="false" data-width="90" data-layout="button_count" data-show-faces="false" data-action="recommend"></div></div></div><div id="fb-root"></div><div class='yarpp-related yarpp-related-none'>
I might switch to not using an ordered list of buttons and I also might steal from arguments from Ken's plugin seeing as I already gave him advice on how I would do it. ;-) Twitter Cards FTW!
I solved my basic problem. I changed how I was including YouTube videos, switching from probably the iFrame based include to the object include. Now I need to tweak my meta data to get it to display even better in Google+. I also tweaked my OpenGraph and Twitter Card meta data and am trying to find larger images through various APIs. My best effort at this can be seen in this blog post.

Need guidance on solution using phonegap and jquery mobile

I'm creating an app using phonegap that pulls the majority of its content from a database. It has a few hundred pages so I thought the best option would be to use a single page solution and just keep loading content into the main div when needed.
I have tried using Handlebars to do this but I'm not sure if that was the best solution as I cant get jquery mobile working with it (the app needs lots of accordions). Have also tried creating my own very simple accordions but failed dismally to even get an onlcick event working within the handlebars script tags.
Can anyone recommend a build that would be good for this job please? Or guide me to some example solutions that are along these lines?
I have googled extensively for 2 days now and have tried quite a few suggestions out but no success so decided to post here.
Many thanks
Generate all the content into your div, but using css hide almost all of them. As the user does what needs to be done to activate your paging call the show() function for the first 10 elements, if you consider 10 to be a page.
Use List View pattern of jquery
// adding data on list view
$('#list_view').append('<li >' your data '</li>');
//refreshing list
$("#list_view").listview("refresh");
//removing elements from list
$("#list_view").empty();
You can use multiple div's as well in the list view
use below link for more:
http://api.jquerymobile.com/listview/

Categories

Resources