Want to win a PS4? Go Premium and enter to win our High-Tech Treats giveaway. Enter to Win

x
?
Solved

RSS Feed not displaying Facebook Like

Posted on 2011-09-16
2
Medium Priority
?
487 Views
Last Modified: 2012-05-12
Hello experts!

I followed this tutorial to create a tab system that displays 3 RSS feeds. At the end of each article, I've included the Facebook Like and Send buttons. The issue is that the first tab correctly displays the Like/Send buttons but the 2nd and 3rd tabs do not.

How can I get the 2nd and 3rd box to correctly display the Facebook buttons?

I've attached the code for the tab page and the php for getting the RSS.

Also, here are screenshots of the box. The first tab displays correctly but the 2nd and 3rd do not.
First tab working correctlySecond tab does not show FB Like buttonThird tab does not show FB Like button
//socialnewsroom.php
<!-- Body Left Styles width: 590px; height: 820px; float: left; margin: 25px 0 25px 0; -->
<div id="body_left" class="rounded_corners">            	
   <h3>Social Media News Room</h3>

	<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=287371014613771&xfbml=1";
          d.getElementsByTagName('head')[0].appendChild(js);
      }(document));
   </script>   	
   
   <hr />
   <script>
	    function tabSwitch_2(active, number, tab_prefix, content_prefix) {  
  
			 for (var i=1; i < number+1; i++) {  
				document.getElementById(content_prefix+i).style.display = 'none';  
				document.getElementById(tab_prefix+i).className = '';  
			 }  
			 document.getElementById(content_prefix+active).style.display = 'block';  
			 document.getElementById(tab_prefix+active).className = 'active';      
		  
		}
	</script>

    <div id="tabbed_box_1" class="tabbed_box">  
        <h4>Browse Site <small>Select a Tab</small></h4>  
        <div class="tabbed_area">  
      
            <ul class="tabs">  
                <li>
                   <a href="javascript:tabSwitch_2(1, 3, 'tab_', 'content_');" id="tab_1" class="active">
                   Inman News
                   </a>
                </li>  
                <li>
                	<a href="javascript:tabSwitch_2(2, 3, 'tab_', 'content_');" id="tab_2">
                  Daily RE News
                  </a>
                </li>  
                <li>
                	<a href="javascript:tabSwitch_2(3, 3, 'tab_', 'content_');" id="tab_3">
                  Tech Savvy Agent
                  </a>
                </li>  
            </ul>   
      
            <div id="content_1" class="content">  
                <ul>  
                    <li>
						  <?php
							displayFeed("http://feeds.feedburner.com/inmannews");
						  ?>
						  </li>  
                </ul>  
            </div>  
            <div id="content_2" class="content">  
                <ul>  
                    <li>
						  <?php 
							  displayFeed("http://feeds.feedburner.com/DailyRealEstateNews?format=xml");						
						  ?>
                    </li>  
                </ul>  
            </div>  
            <div id="content_3" class="content">  
                <ul>  
                    <li>
						  <?php 
							  displayFeed("http://techsavvyagent.com/feed/");  						  
						  ?>
                    </li> 
                </ul>  
            </div>  
      
        </div>  
      
    </div>    

</div>

Open in new window

//getrss.php
<?php
	function parseRSS($xml)
      {
         echo "<strong>".$xml->channel->title."</strong><br /><br />";
         $cnt = count($xml->channel->item);
         for($i=0; $i<$cnt; $i++)
         {
            $url 	= $xml->channel->item[$i]->link;
            $title 	= $xml->channel->item[$i]->title;
            $desc = $xml->channel->item[$i]->description;
            
            echo '<a href="'.$url.'">'.$title.'</a><br/ >'.$desc.'';
            echo '';
            echo '
				<br />
            <div class="fb-like" 
					data-href="' . $url . '" 
					data-send="true" 
					data-width="450" 
					data-show-faces="false" 
					data-font="arial">
				</div><strong></strong><br />			
				<hr />
            ';
         }
      }//end parseRSS
	
	function displayFeed($url) {		
		
      //Code from http://ditio.net/2008/06/19/using-php-curl-to-read-rss-feed-xml/
      $ch = curl_init($url);
      
      curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
      curl_setopt($ch, CURLOPT_HEADER, 0);
      
      $data = curl_exec($ch);
      curl_close($ch);
      
      $doc = new SimpleXmlElement($data, LIBXML_NOCDATA);                  
		
		//print_r($doc);
      if(isset($doc->channel))
      {
          parseRSS($doc);
      } else {
         echo 'There was an error parsing the RSS feed. Please contact your online specialist.';	
      }
		
	}//end displayFeed
	function test() {
		echo 'testing function';	
	}
?>

Open in new window

0
Comment
Question by:spoggles
[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
2 Comments
 
LVL 3

Expert Comment

by:dkellner
ID: 36556490
Try adding some BRs, maybe the FB buttons are only hiding.  I can see no reason for them not to be there.  If BRs help, you can remove them and find a real CSS way to fix the problem - like encapsulating the buttons in some outer div or stuff.
0
 
LVL 3

Accepted Solution

by:
dkellner earned 2000 total points
ID: 36556502
Oh yes, there they are! I can see them now.  The top of the buttons.  They're just overlapped which means some strange CSS rule has been applied to "fb-like".  As I said, give it an outer DIV or custom styles to prevent hiding.  And one more note - different browsers may behave differently at this point.
0

Featured Post

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

Question has a verified solution.

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

When it comes to security, close monitoring is a must. According to WhiteHat Security annual report, a substantial number of all web applications are vulnerable always. Monitis offers a new product - fully-featured Website security monitoring and pr…
Originally, this post was published on Monitis Blog, you can check it here . In business circles, we sometimes hear that today is the “age of the customer.” And so it is. Thanks to the enormous advances over the past few years in consumer techno…
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …
Suggested Courses

596 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