Official twitter widget fails in WordPress blog

I started blogging on free wordpress platform and I wanted to add official twitter widget to my blog.

I add following code as text widget to blog’s side bar in twenty fourteen theme.

Read More
<a class="twitter-timeline" href="https://twitter.com/Menuka_cs3" data-widget-id="695529194466504704">Tweets by @Menuka_cs3</a>
<script>
    ! function(d, s, id) {
        var js, fjs = d.getElementsByTagName(s)[0],
            p = /^http:/.test(d.location) ? 'http' : 'https';
        if (!d.getElementById(id)) {
            js = d.createElement(s);
            js.id = id;
            js.src = p + "://platform.twitter.com/widgets.js";
            fjs.parentNode.insertBefore(js, fjs);
        }
    }(document, "script", "twitter-wjs");
</script>

but it look like this

enter image description here

what I was able to detect when I save the widget it lost it’s <script> tags so it just show the content letters. Here is what I get when I save the widget

<a class="twitter-timeline" href="https://twitter.com/Menuka_cs3">Tweets by @Menuka_cs3</a> !function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");

Please help. Thanks

Related posts

3 comments

  1. I think you are trying to add code javasript in text widget of WordPress.com blogs. You can’t.

    Users are not allowed to post JavaScript on WordPress.com blogs.
    JavaScript can be used for malicious purposes. As an example,
    JavaScript has taken sites such as MySpace.com and LiveJournal offline
    in the past. The security of all WordPress.com blogs is a top priority
    for us, and until we can guarantee scripting languages will not be
    harmful, they will not be permitted.

    JavaScript from trusted partners, such as YouTube and Google Video, is
    converted into a WordPress shortcode when a post is saved.

    https://en.support.wordpress.com/code/#javascript

    But if you are in WordPress.com VIP, and need to embed your Twitter timeline, you could follow this post How To Embed a Twitter Timeline Widget.

  2. When WordPress saves the content, it filters it because it thinks its text, not code. One possible solution is to create a shortcode like this:

    Open you theme/functions.php file and paste this at the end

    function twitter_shortcode( $atts) {
        $twitter = '<a class="twitter-timeline" href="https://twitter.com/Menuka_cs3" data-widget-id="695529194466504704">Tweets by @Menuka_cs3</a>
    <script>
        ! function(d, s, id) {
            var js, fjs = d.getElementsByTagName(s)[0],
                p = /^http:/.test(d.location) ? 'http' : 'https';
            if (!d.getElementById(id)) {
                js = d.createElement(s);
                js.id = id;
                js.src = p + "://platform.twitter.com/widgets.js";
                fjs.parentNode.insertBefore(js, fjs);
            }
        }(document, "script", "twitter-wjs");
        </script>';
        return $twitter;
    }
    add_shortcode( 'twitter', 'twitter_shortcode' );
    

    Then, on your post you call the shortcode:

    [twitter]
    

    Please note that this function is completely untested but was taken from the official wordpress page at:

    https://codex.wordpress.org/Shortcode_API

  3. Try this code

    <a class="twitter-timeline" href="https://twitter.com/Menuka_cs3" data-widget-id="710522346977824769">tweets by @Menuka_cs3</a>
    <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
    

Comments are closed.