I want to embed a gist containing a Google Chart (rendered here) into this github.io page.
I've tried
<script src="https://cdn.rawgit.com/whanley/71bc1fac509a23b93a3a89b51af32bf8/raw/d98c33c8fbf5ee67a89395c0e435ac9568bcd0c1/dig-eg-gaz-issues-calendar-chart.html"></script>
and
<image src="https://cdn.rawgit.com/whanley/71bc1fac509a23b93a3a89b51af32bf8/raw/d98c33c8fbf5ee67a89395c0e435ac9568bcd0c1/dig-eg-gaz-issues-calendar-chart.html"></image>
and
{% gist 71bc1fac509a23b93a3a89b51af32bf8 %}
but these are not the right thing to do. Help?
Instead of using script or image, I need to use iframe in the code listed above. Works fine now.
Related
I've been stuck for the past few hours trying to figure out why the core Polymer elements are not being displayed properly in a Django application I'm making to act as a personal webpage. The application at the moment just points to an index.html page which, if you follow the tutorial on Polymer, is up to step one.
However, the components are not loading on my page. The static files are all set up correctly, and there's subtle animation from the css files being loaded correctly, but the Roboto font and the core-elements are not being displayed. Running the site as a normal HTML file does everything correctly.
Is there a specific way to user Polymer in a Django template?
Thanks.
See Eric's answer to this on the polymer-dev mailing list: https://groups.google.com/forum/?fromgroups=#!searchin/polymer-dev/django/polymer-dev/N2R8qknalOI/58ZhC1gWFh4J
Relevant excerpt:
Django 1.5 has support for the verbatim tag. You can wrap your inlined element definitions in that:
https://docs.djangoproject.com/en/1.5/ref/templates/builtins/#verbatim
Example code snippet:
{% verbatim %}
<template repeat="{{item as items}}">
<my-element name="{{item.name}}"></my-element>
</template>
{% endverbatim %}
<script>
document.querySelector("template').model = {{items}}; // items here is filled by the server's template.
</script>
I'm pretty sure this has to do with the fact that Django uses the same {{}} in its templates as Polymer.
I'm adding this answer as a compliment to the already accepted answer.
You can force django to require a space for it's template tags. So for any django template tags you have to use {{ variable }} and for polymer you will use {{variable}}.
Here is a very simple module/app I created to "prepare" django for use alongside polymer.
https://github.com/andrewebdev/django-ostinato/blob/2c435dea23319be6e9011e7381afca2b4092b5a2/ostinato/polyprep/init.py
Credit goes to https://github.com/nebrybledu for this suggestion.
I'm having difficulty getting Django Chartkick to work when using the library option. The application is somewhat complex but briefly when I do not use the library option the chart renders. When I do it does not render.
More specifically this doesn't render:
{% column_chart count_by_type_type with library= {"title":"Super chart",width:"400px"} %}
This does render
{% column_chart count_by_type_type %}
Thanks for any clues as to why and how to fix.
Edit 20140415
width:"400px"
should be
"width":"400px"
However, that does not resolve the issue.
With "width" changed the chart renders with a title and width with Google Charts. When using Highcharts, however, there is no title.
This appears to be a bug in Django Chartkick when using Highcharts. See https://github.com/mher/chartkick.py/issues/13 and comments.
The underlying problem was that I was using the Google Charts API not the Highcharts API. Thanks to Mher Movsisyan the owner of Django Chartkick for a quick answer on Github.
This is his answer for the benefit of other stackoverflow users:
The configuration formats for Google Charts and HighCharts are
different. You are trying to apply the Google Charts api to
HighCharts.
In this particular example you need to use:
{% pie_chart browser_stats with library={"title":{"text":"Browser Statistics, May 2013"}} %}
See Highcharts API http://www.highcharts.com/docs/chart-concepts/title-and-subtitle
For a fuller discussion see https://github.com/mher/chartkick.py/issues/13
Sorry up front if my terminology will be non-standard, but I am new to Django and Python...I am using Python 2.7.3 and Django 1.4.3 on a Mac OSX 10.7 (Lion). Django-autocomplete-light version 1.1.7.
I am using the django-autocomplete-light module to create a page where I can search within a set of videos (hosted on an external source like Youtube). I defined a model / app called Videos that contains a set of videos hosted on this third-party site. At the top of my videos/index.html page, I have a search box that is powered by the django-autocomplete-light module. I have gotten the overall search function working--when I type something into the search box, the relevant videos are shown in the drop-down menu automatically. I want the clicked video to play within an embedded player on the page--for some reason, this keeps on loading the video into the entire, existing document / page instead of just the iFrame. In my structure for the search box, I included the "target" attribute already. My understanding is that including "target" should work, but I must be missing something. When I check Firebug, the "target" attribute is included in the link in the search results (sorry, can't post a screenshot of this since I don't have enough reputation points...but it's there. The iFrame also has its "name" attribute assigned to the same thing).
Side note--I am hosting the video on a private service (not Youtube), so I prefer not to use a library like jQuery TubePlayer...but the concept remains the same).
My questions--is there another way to do this? Am I missing something obvious? Does django-autocomplete-light not play nice with iFrames?
(templates/videos/index.html)
<iframe name="tvplayer" width="560" height="315" src="http://www.youtube.com/embed/CE0Q904gtMI" frameborder="0" allowfullscreen></iframe>
(navigation_autocomplete/autocomplete.html)--I understand that all videos will return the same link using this code, but I can't even get this one to work!
{% for video in videos %}
<a style="display:block" href="http://www.youtube.com/embed/3svKWr9LH4I" target="tvplayer">{{ video.title }} - {{ video.desc }}</a>
{% endfor %}
Thanks for your help!
Solved my own question...within the navigation_autocomplete/script.html page, you have to change the navigation_autocomplete javascript handler directly since it overrides any other styling / parameters that you put into the a tag.
I'm having a weird problem on this page www.vivopositivo.it/media/foto/guarda-chi-sorride-over-18-e-famiglie/ with the like button. I'm using PrettyPhoto to include the pictures from Flickr and open them in a lightbox. Each picture has it's own like button which shows in the lightbox and uses a specific URL such as:
http://www.vivopositivo.it/media/foto/guarda-chi-sorride-over-18-e-famiglie/#prettyPhoto[pp_gal]/1/
where the number in #prettyPhoto[pp_gal]/1/ is the key for the specific image.
The like buttons are included with the following code:
iframe src="//www.facebook.com/plugins/like.php?locale=en_US&href={location_href}&layout=button_count&show_faces=true&width=500&action=like&font&colorscheme=light&height=23" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:500px; height:23px;" allowTransparency="true" /iframe
where {location_href} gets replaced with the image specific URL.
This works for most of the images, but for some of them doesn't! They seem to get the like counter of the page instead, therefore, I get about 10 images which show the same 128 like counter which is obviously wrong. This seems completely random..
Do you have any idea on how to fix this?
Cheers,
Andrea
This is because of # in URL which identifies the image.
Please refer to this post for further explanation.
I am using Facebook JS SDK for integrating Like buttons in my Rails App. This sunny Monday the like buttons disappeared, and I opened Firebug to check what was going on. I found this error:
ga is undefined (line 25 of http://connect.facebook.net/en_US.all.js#xfbml=1)
So... I created an empty file not related to my Rails app, and I did something as simple as:
<html>
<body>
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like href="" layout="button_count" show_faces="false" width="450" font=""></fb:like>
</body>
</html>
And yes, the error is still there. Any thoughts?
I opened a ticket to Facebook, and apparently some other people were having the same problem. It seemed to be a temporary problem because now is up and running normally. I wasn't able to find the reason, and one of the Facebook employees replied when everything was running normally, so I can't give a clear answer of what was going on.
Please use <div class="fb-like"></div> instead of <fb:like></fb:like>
See http://developers.facebook.com/docs/reference/plugins/like/ and refetch the example code.
It took me a while before I noticed the change in HTML code provided by Facebook.
if you add <div id="fb-root"></div> to your page it will work again ... not sure if it's a temporary bug or a change within their API yet ... :-/
I have fix this bug (for sharrre, jquery plugin) by adding this div:
<div id="fb-root"></div>
Edit: oops I haven't seen the Hellkeeper answer's :)
Your href property is empty in the fb:like tag.