logo-dw

Go Back   Dreamweaver Club Forums > Dreamweaver forums > Dreamweaver General
Register FAQ Members List Search Today's Posts Mark Forums Read

Reply
 
Thread Tools Display Modes
Old 05-16-2012, 01:25 PM   #1
Mejse78
 
Join Date: May 2012
Posts: 10
Default Facebook widget - description not working

Hi, there.

This is my first question here - so I hope I get it right.

I've just tried out using the facebook like-button widget for the first time.. and something is off. It makes the like bottun, but in the link that's appearing on FB there's no description. It just says: ENTER DESCRIPTION HERE.

I've tried to combine it with meta-tags.. but no luck!

MY HTML:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<html><!-- InstanceBegin template="/Templates/index.dwt" codeOutsideHTMLIsLocked="false" -->
<head>


<!-- InstanceBeginEditable name="doctitle" -->
<title>Galleri Kessel</title>
<script type="text/xml">
<!--
<oa:widgets>
  <oa:widget wid="2149022" binding="#OAWidget" />
</oa:widgets>
-->
</script>
<!-- InstanceEndEditable -->


<link href="css/styles.css" rel="stylesheet" type="text/css" media="screen">


</head>



<body>


<div id="space" >
<div id="paper">
    
 <!-- InstanceBeginEditable name="top" -->

 <div id="top"> 
        <img src="images/layout/logo.gif" />
    </div>
    <div class="fb"> 
   <script type="text/javascript">
// BeginOAWidget_Instance_2149022: #OAWidget

    var urlToLike = 'http://www.jonnakessel.dk/index.html';
    if (urlToLike == '') {
            urlToLike = window.location.href;
      }
      urlToLike = encodeURIComponent(urlToLike);

      var font = encodeURIComponent('tahoma');


document.write ('<iframe src="http://www.facebook.com/widgets/like.php?locale=da_DK&amp;href='+urlToLike+'&amp;layout=standard&amp;show_faces=false&amp;width=350&amp;height=50&amp;action=like&amp;font='+font+'&amp;colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; border-color:#ffffff; overflow:hidden; width:350; height:50"></iframe>')


// EndOAWidget_Instance_2149022
   </script>
 </div>
  
  


<br>

    
    <!-- InstanceEndEditable -->
    
    <div id="banner" > 
        <img src="images/layout/topbanner3.gif"  />
    </div>


   <div id="menu" >
            <div class="float">
            <ul>
                <li><a href="index.html">HJEM</a></li>
                <li><a href="galleri.html">GALLERI</a></li>
                <li><a href="udstilling.html">UDSTILLINGER</a></li>
                <li><a href="kontakt.html">KONTAKT</a></li>
            </ul>
            </div>
        </div>
   <!-- InstanceBeginEditable name="jonna" -->
   <div id="jonna" >

     <div><img class=image_frame src="images/layout/jonna.gif" />
     </div>

      
     <div class="tekst">
       
           <br>
     <br><h2>Jonna Kessel</h2>
         <p>Født 24.07.49 <br><br>
         Scenograf  v. Stavtrup Scenen siden 1993.</p><br>
         <h2>Atalier:</h2>
         <p>Råhøj Parken 79
         <br>8260 Viby J </p>
         <br>
         <br>
         
          <h2>Studierejser:</h2>
      <p><b>1989:</b> 
      <br>Frankrig - Les Tuilerie D'affiac, Avignon, Arles, Carcassonne og Montpellier 
      <br>
      <br> 
      <b>1990: </b>
      <br>Sydfrankrig - Agay, Antibes og Vence
      <br>
      <br>
      <b>1992: </b>
      <br>Italien - Pietrasanta
      <br>
      <br>
      <b>2000: </b>
      <br>Italien - Ophold i billedkunstneren Jørgen Haugen Særensens hus Villa Simi i Pietrasanta
      <br>
      <br>
      <br>
      </p>
      <h2>Fonde og legater:</h2>
      <p><b>1989: </b>
      <br>Den Ingwersenske Fond
      <br>
      <br>
      <b>1990: </b>
      <br>Kulturministeriets Fond
      <br>
      <br>
      <b>1992: </b>
      <br>Nordisk Kultur Fond</p>
     </div>
   </div>
   <!-- InstanceEndEditable -->
   
   <!-- InstanceBeginEditable name="content" -->
    

    <div id="indhold">

      <h1>Velkommen til Galleri Kessel</h1>
            
      <p>I dette galleri kan du se mine værker og min rejse som billedkunstner.</p>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <img class="billede" src="images/layout/forside.gif" />
      <br><p class="billedtext">Fugle</p>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <img class="billede2" src="images/layout/en fri fugl.gif"/>
      <br><p class="billedtext2">En fri fugl</p>
     
      
    </div>
    <!-- InstanceEndEditable -->
    


    <div id="footer">
        <p class="footer-text">©2012 Galleri Kessel  <font color: #696933>|</font>  All Rights Reserved<br>
          Designed by <a href="http:/www.tegnehulen.dk" target="_blank">tegnehulen.dk</a> &hearts;  Latest Update: maj, 2012</p>
    </div>

</div>
</div>

</body>
<!-- InstanceEnd --></html>
With meta-tags:
Code:
<head>


<!-- InstanceBeginEditable name="doctitle" -->
<title>Galleri Kessel</title>
<meta property="og:title" content="Galleri Kessel" />
<meta property="og:type" content="website" />
<meta property="og:url" content="http://www.jonnakessel.dk" />
<meta property="og:image" content="http://i1086.photobucket.com/albums/j447/Mejse78/frifugl.gif" />
<meta property="og:description" content="esøg dette smukke galleri. Her kan du se mine værker og min rejse som billedkunstner." />


<script type="text/xml">
<!--
<oa:widgets>
  <oa:widget wid="2149022" binding="#OAWidget" />
</oa:widgets>
-->
</script>
<!-- InstanceEndEditable -->


<link href="css/styles.css" rel="stylesheet" type="text/css" media="screen">
</head>
I gave it a name and a description in the configuration and I've been trying to figure out, if I need to upload something to the server to make this work?
But I can't see what it should be....

Thanks for taking the time to help out ☼

Last edited by Mejse78; 05-16-2012 at 01:29 PM..
Mejse78 is offline   Reply With Quote
Old 05-16-2012, 04:23 PM   #2
Corrosive
Corrosive's Avatar
 
Join Date: Feb 2008
Location: Bristol, England
Posts: 7,103
Default

So it doesn't pick a description up from the description meta tag then?
Corrosive is offline   Reply With Quote
Old 05-16-2012, 06:02 PM   #3
johnMoss
johnMoss's Avatar
 
Join Date: Dec 2010
Location: Dallas
Posts: 869
Default

If you're going to plug in the open graph you might consider adding the open-like as well.

Your problem is you haven't declared your markup.

Place this tag at the top of your page:

HTML Code:
<html lang="en" prefix="og: http://ogp.me/ns#">

then a head tag, add in all of your OG markup, and then close the head tag.
After this, redeclare your html and follow through with the rest of your script.

Here's an explanation: http://ogp.me/

and here's a working example: http://www.cheapcaribbean.com/
__________________
LinkedIn: jM
johnMoss is offline   Reply With Quote
Old 05-21-2012, 08:18 AM   #4
Mejse78
 
Join Date: May 2012
Posts: 10
Default Now something's working - and some not

Thanks for your help. Now there's an description... but not the one I gave..
Instead it took part of the text on the page and used that. Sadly it's a part that is not great as an description.. And I just don't understand why...

Can you help me out?

Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<html lang="en" prefix="og: http://ogp.me/ns#"><!-- InstanceBegin template="/Templates/index.dwt" codeOutsideHTMLIsLocked="false" -->
<head>


<!-- InstanceBeginEditable name="doctitle" -->
<title>Galleri Kessel</title>
<meta property="og:title" content="Galleri Kessel"/>
    <meta property="og:type" content="website"/>
    <meta property="og:url" content="http://www.jonnakessel.dk"/>
    <meta property="og:image" content="http://i1086.photobucket.com/albums/j447/Mejse78/frifugl.gif"/>
    <meta property="og:site_name" content="Galleri Kessel"/>
    
    <meta property="og:description"
          content="I dette galleri kan du se mine værker og min rejse som billedkunstner."/>
<!-- InstanceEndEditable -->


<link href="css/styles.css" rel="stylesheet" type="text/css" media="screen">


</head>



<body>


<div id="space" >
<div id="paper">
    
 <!-- InstanceBeginEditable name="top" -->

 <div id="top"> 
        <img src="images/layout/logo.gif" />
    </div>
    <div class="fb"> 
  <iframe src="//www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.jonnakessel.dk&amp;send=false&amp;layout=standard&amp;width=450&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;font&amp;height=35" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:35px;" allowTransparency="true"></iframe>
 </div>
  
  


<br>

    
    <!-- InstanceEndEditable -->
    
    <div id="banner" > 
        <img src="images/layout/topbanner3.gif"  />
    </div>


   <div id="menu" >
            <div class="float">
            <ul>
                <li><a href="index.html">HJEM</a></li>
                <li><a href="galleri.html">GALLERI</a></li>
                <li><a href="udstilling.html">UDSTILLINGER</a></li>
                <li><a href="kontakt.html">KONTAKT</a></li>
            </ul>
            </div>
        </div>
   <!-- InstanceBeginEditable name="jonna" -->
   <div id="jonna" >

     <div><img class=image_frame src="images/layout/jonna.gif" />
     </div>

      
     <div class="tekst">
       
           <br>
     <br><h2>Jonna Kessel</h2>
         <p>Født 24.07.49 <br><br>
         Scenograf  v. Stavtrup Scenen siden 1993.</p><br>
         <h2>Atalier:</h2>
         <p>Råhøj Parken 79
         <br>8260 Viby J </p>
         <br>
         <br>
         
          <h2>Studierejser:</h2>
      <p><b>1989:</b> 
      <br>Frankrig - Les Tuilerie D'affiac, Avignon, Arles, Carcassonne og Montpellier 
      <br>
      <br> 
      <b>1990: </b>
      <br>Sydfrankrig - Agay, Antibes og Vence
      <br>
      <br>
      <b>1992: </b>
      <br>Italien - Pietrasanta
      <br>
      <br>
      <b>2000: </b>
      <br>Italien - Ophold i billedkunstneren Jørgen Haugen Særensens hus Villa Simi i Pietrasanta
      <br>
      <br>
      <br>
      </p>
      <h2>Fonde og legater:</h2>
      <p><b>1989: </b>
      <br>Den Ingwersenske Fond
      <br>
      <br>
      <b>1990: </b>
      <br>Kulturministeriets Fond
      <br>
      <br>
      <b>1992: </b>
      <br>Nordisk Kultur Fond</p>
     </div>
   </div>
   <!-- InstanceEndEditable -->
   
   <!-- InstanceBeginEditable name="content" -->
    

    <div id="indhold">

      <h1>Velkommen til Galleri Kessel</h1>
            
      <p>I dette galleri kan du se mine værker og min rejse som billedkunstner.</p>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <img class="billede" src="images/layout/forside.gif" />
      <br><p class="billedtext">Fugle</p>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <br>
      <img class="billede2" src="images/layout/en fri fugl.gif"/>
      <br><p class="billedtext2">En fri fugl</p>
     
      
    </div>
    <!-- InstanceEndEditable -->
    


    <div id="footer">
        <p class="footer-text">©2012 Galleri Kessel  <font color: #696933>|</font>  All Rights Reserved<br>
          Designed by <a href="http:/www.tegnehulen.dk" target="_blank">tegnehulen.dk</a> &hearts;  Latest Update: maj, 2012</p>
    </div>

</div>
</div>

</body>
<!-- InstanceEnd --></html>
Besides... I would like people to add a comment when they like... but that has dissapeared.

Thanks
Mejse78 is offline   Reply With Quote
Old 05-21-2012, 02:15 PM   #5
johnMoss
johnMoss's Avatar
 
Join Date: Dec 2010
Location: Dallas
Posts: 869
Default

You did not copy the code placements in the proper format. Look at your declaration at line 1 and then compare it to the examples. See anything different?
__________________
LinkedIn: jM
johnMoss is offline   Reply With Quote
Old 05-21-2012, 06:56 PM   #6
domedia
Administrator
domedia's Avatar
 
Join Date: Dec 2003
Posts: 9,730
Default

Hej Mejse,

Just a quick note to be careful about what doctype you declare, and the type of code you actually write. You are declaring the page as HTML 4.01 strict, but you write XHTML. I'm not sure this is a bog problem, but you probably should get that sorted out. This is called the 'Doctype declaration'.
domedia is offline   Reply With Quote
Old 05-21-2012, 07:18 PM   #7
johnMoss
johnMoss's Avatar
 
Join Date: Dec 2010
Location: Dallas
Posts: 869
Default

Quote:
Originally Posted by domedia View Post
Hej Mejse,

I'm not sure this is a big problem, but you probably should get that sorted out. This is called the 'Doctype declaration'.
It is the problem... As soon as it's corrected, it'll work fine... Kind of an odd markup they have going, but Facebook writes their own rules... You have to open & close the head with required markup, & then redeclare the page with whatever markup you're normally using. The vacation site link above shows an active example.
__________________
LinkedIn: jM
johnMoss is offline   Reply With Quote
Old 05-22-2012, 01:57 PM   #8
domedia
Administrator
domedia's Avatar
 
Join Date: Dec 2003
Posts: 9,730
Default

The <html> tag is not the doctype declaration though.

Here's the one for html 4.01 strict:
HTML Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
domedia is offline   Reply With Quote
Old 05-24-2012, 12:34 PM   #9
Mejse78
 
Join Date: May 2012
Posts: 10
Default

Quote:
Originally Posted by johnMoss View Post
You did not copy the code placements in the proper format. Look at your declaration at line 1 and then compare it to the examples. See anything different?
Thank you SO much! This helped.
I'm not familiar with all the document types - the one in my file is a DW declaration. But I've deleted it now - and I used the:
Code:
<meta charset="utf-8" />
- and it works. YAY!

Does anyone have a link where I can read about these doctypes?

Thanks again.
Mejse78 is offline   Reply With Quote
Old 05-24-2012, 02:13 PM   #10
johnMoss
johnMoss's Avatar
 
Join Date: Dec 2010
Location: Dallas
Posts: 869
Default

http://www.w3.org/ is the place to go.
__________________
LinkedIn: jM
johnMoss is offline   Reply With Quote
Reply


Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 03:45 PM.


Powered by vBulletin® Version 3.8.7
Copyright ©2000 - 2018, vBulletin Solutions, Inc.
Copyright 2006 DreamweaverClub.com