Solved

how to load faster google +1 button and facebook like button

Posted on 2011-09-20
2
346 Views
Last Modified: 2012-05-12
Hi, here we go again, i have one page that i need to load some facebook and google buttons, but i don't want my page load depends on waiting for the google and facebook to load the button. so i can get the best performance that i can get.
i have an listview that load data and each row have an google and facebook like button. so easy page have maybe 20 facebook and 20 google +1 button.

any suggestions?


<asp:ListView ID="ListView1" runat="server" DataSourceID="ObjectDataSource1"  GroupItemCount="1"  DataKeyNames="ID">
                               <EmptyItemTemplate>
                                <td id="Td1" runat="server" />
                                </EmptyItemTemplate>
                                <ItemTemplate>   
                                    <td id="Td2" runat="server" style="width:100%;text-align:left;color: #000000;width:25px;font-family:Helvetica Neue, Helvetica, Arial, Verdana, sans-serif;line-height : 1.6em;text-align:justify;font-size : 17px;" valign="top">
                                      <p style="min-width:620px;width:100%;text-align:justify;font-family:Helvetica Neue, Helvetica, Arial, Verdana, sans-serif;line-height : 1.8em;text-align:justify;font-size : 17px;">
                                               <%#Eval("NAME")%>
                                      </p>
                                      <div  style="width:100%;border-width: 0px; padding: 0; margin:-21px 0px 0px 0px; font-size: 15px; font-weight: bold; text-align: right; position: relative;" >
                                          <table style="float: right">
                                              <tr>
                                                  <td>
                                                      &nbsp;
                                                  </td>
                                                  <td> 
                                                        <!-- Place this tag where you want the +1 button to render -->
                                                        <g:plusone size="medium" href="<%=Default.aspx?id=<%#Eval("ID").ToString()%>"></g:plusone>
                                                  </td>
                                                  <td>
                                                        <div id="fb-root"></div>
                                                        <script>                                    (function (d) {
                                                                var js, id = 'facebook-jssdk'; if (d.getElementById(id)) { return; }
                                                                js = d.createElement('script'); js.id = id; js.async = true;
                                                                js.src = "//connect.facebook.net/en_US/all.js#appId=289975351015813&xfbml=1";
                                                                d.getElementsByTagName('head')[0].appendChild(js);
                                                            } (document));</script>
                                                        <div class="fb-like" data-href="<%=Default.aspx?id=<%#Eval("ID").ToString()%>" data-send="false" data-layout="button_count" data-width="50" data-show-faces="false"></div>
                                                  </td>
                                              </tr>
                                          </table>
                                       </div>
                                    </td>
                                </ItemTemplate>

Open in new window

0
Comment
Question by:rafaelrgl
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
2 Comments
 
LVL 27

Accepted Solution

by:
Sammy earned 500 total points
ID: 36578281
the easiest way to do this is to wrap your datalist in an update panel and of course a script manager
something like this
<asp:ScriptManager ID="ScriptManager1" runat="server" />
  <asp:UpdatePanel ID="UpdatePanel1" runat="Server">
            <ContentTemplate>
          <asp:ListView ID="ListView1" runat="server" DataSourceID="ObjectDataSource1"  GroupItemCount="1"  DataKeyNames="ID">
                               <EmptyItemTemplate>
                                <td id="Td1" runat="server" />
                                </EmptyItemTemplate>
                                <ItemTemplate>  
                                    <td id="Td2" runat="server" style="width:100%;text-align:left;color: #000000;width:25px;font-family:Helvetica Neue, Helvetica, Arial, Verdana, sans-serif;line-height : 1.6em;text-align:justify;font-size : 17px;" valign="top">
                                      <p style="min-width:620px;width:100%;text-align:justify;font-family:Helvetica Neue, Helvetica, Arial, Verdana, sans-serif;line-height : 1.8em;text-align:justify;font-size : 17px;">
                                               <%#Eval("NAME")%>
                                      </p>
                                      <div  style="width:100%;border-width: 0px; padding: 0; margin:-21px 0px 0px 0px; font-size: 15px; font-weight: bold; text-align: right; position: relative;" >
                                          <table style="float: right">
                                              <tr>
                                                  <td>
                                                      &nbsp;
                                                  </td>
                                                  <td>
                                                        <!-- Place this tag where you want the +1 button to render -->
                                                        <g:plusone size="medium" href="<%=Default.aspx?id=<%#Eval("ID").ToString()%>"></g:plusone>
                                                  </td>
                                                  <td>
                                                        <div id="fb-root"></div>
                                                        <script>                                    (function (d) {
                                                                var js, id = 'facebook-jssdk'; if (d.getElementById(id)) { return; }
                                                                js = d.createElement('script'); js.id = id; js.async = true;
                                                                js.src = "//connect.facebook.net/en_US/all.js#appId=289975351015813&xfbml=1";
                                                                d.getElementsByTagName('head')[0].appendChild(js);
                                                            } (document));</script>
                                                        <div class="fb-like" data-href="<%=Default.aspx?id=<%#Eval("ID").ToString()%>" data-send="false" data-layout="button_count" data-width="50" data-show-faces="false"></div>
                                                  </td>
                                              </tr>
                                          </table>
                                       </div>
                                    </td>
                                </ItemTemplate>
            </ContentTemplate>
            </asp:UpdatePanel>
0
 
LVL 1

Author Closing Comment

by:rafaelrgl
ID: 36585106
much better now. thanks
0

Featured Post

Free Tool: IP Lookup

Get more info about an IP address or domain name, such as organization, abuse contacts and geolocation.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article discusses the difference between strict equality operator and equality operator in JavaScript. The Need: Because JavaScript performs an implicit type conversion when performing comparisons, we have to take this into account when wri…
Introduction HyperText Transfer Protocol (http://www.ietf.org/rfc/rfc2616.txt) or "HTTP" is the underpinning of internet communication.  As a teacher of web development I have heard many questions, mostly from my younger students who have come to t…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

734 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question