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

x
?
Solved

facebook custom fan page: doctype or iframe

Posted on 2011-02-14
9
Medium Priority
?
1,409 Views
Last Modified: 2012-05-11
We have a facebook fan page here using FBML:

http://www.facebook.com/pages/NLP-Institute-of-California/169772046384702

except it shows up different all over the place depending on the browser and browser version.

Can you show me how to use a doctype or iframe to solve this problem?

Thanks.
0
Comment
Question by:weikelbob
[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
  • 6
  • 2
9 Comments
 
LVL 6

Assisted Solution

by:Mike D
Mike D earned 1000 total points
ID: 34895750
Hi,

the Image returns a 404

http://nlpdvds.com/wp-content/uploads/2011/01/nlpca_facebook_home.jpg

If you know that
it shows up different all over the place depending on the browser and browser version
, why not do us (and with that yourself) a favor and include screenshots, ideally highlighting the differences?

JD
0
 
LVL 7

Author Comment

by:weikelbob
ID: 34898230
I had a problem with one of the pages. Let's take this page for now:

http://www.facebook.com/pages/NLP-Institute-of-California/169772046384702?sk=app_7146470109#!/pages/NLP-Institute-of-California/169772046384702?sk=app_6009294086

It looks good in all of my browsers, FF mac, safari, opera, FF PC, IE6, IE7 but it's messed up on other people's computers

The attached file AllMyBrowsersw.jpg has a line in it from pasting 2 screenshots together. It actually looks perfect in real life.

I think I need to go with an iframe. I don't think something this complex will work in FBML.
AllMyBrowsersw.jpg
FriendsPC.jpg
0
 
LVL 6

Expert Comment

by:Mike D
ID: 34898656
Without knowing the Code i can only guess... Might be a Cache issue; try adding '?x=123' or something to your Images... Or, post the Code, explain what you expect, describe what You're getting instead...
0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 7

Author Comment

by:weikelbob
ID: 34898917
You don't think that page is too complex for fbml?

You don't think an iframe is the only way to go?

I don't think I can post the code, but I can tell you what I'm doing.
<link rel="stylesheet" type="text/css" href="http://nlpdvds.com/wp-content/uploads/2011/01/style.css?v=17.45">

<fb:visible-to-connection>
   <div id="shop-wrapper">

      <div id="shop-top3-header">
<a href="http://www.nlpca.com"><img src="image here"></a>
      </div>

         <div id="shop-top3-wmdvd-journey">

      <div id="shop-top3-wmdvd">
<a href="https://nlpca.infusionsoft.com/cart/store.jsp?view=4&i=p39&navicat=5&navisubcat=9&naviprod=39"><img src="image here"></a>
      </div>

      <div id="shop-top3-journey">
<a href="https://nlpca.infusionsoft.com/cart/store.jsp?view=4&i=p69&navicat=5&navisubcat=9&naviprod=69"><img src="image here"></a>
      </div>

         </div>
         <div id="shop-top3-early-DSR">

      <div id="shop-top3-early">
<a href="https://nlpca.infusionsoft.com/cart/store.jsp?view=4&i=p67&navicat=5&navisubcat=9&naviprod=67"><img src="image here"></a>
      </div>

      <div id="shop-top3-DSR">
<a href="https://nlpca.infusionsoft.com/cart/store.jsp?view=4&i=p59&navicat=5&navisubcat=9&naviprod=59"><img src="image here"></a>
      </div>

         </div>


      <div id="shop-shopsite">
<a href="http://www.shop.nlpca.com"><img src="image here"></a>
      </div>
         
      <div id="shop-menu">

         <div id="shop-menu-about">
<a href="http://www.nlpca.com/DCweb/NLPca_mission.html"><img src="image here"></a>
        </div>

         <div id="shop-menu-training">
<a href="http://www.facebook.com/pages/NLP-Institute-of-California/169772046384702?v=app_7146470109&ref=sgm"><img src="image here"></a>
          </div>

         <div id="shop-menu-shop">
<a href="http://www.facebook.com/pages/NLP-Institute-of-California/169772046384702?v=app_6009294086&ref=sgm"><img src="image here"></a>
          </div>

         <div id="shop-menu-contact">
<a href="http://www.nlpca.com/DCweb/Contact_Us.html"><img src="image here"></a>
          </div>

      </div>

</div>
</fb:visible-to-connection>
</fb:fbml>

Open in new window

#shop-wrapper
{
float:left;
width:520px;
height:1461px;
}

#shop-wrapper2
{
float:left;
width:520px;
height:1174px;
}

#shop-top3-header
{
float:left;
width:520px;
height:178px;
margin-top:-3px;

}

#shop-top3-wmdvd-journey
{
float:left;
width:520px;
height:716px;
margin-top:-3px;
}

#shop-top3-wmdvd
{
float:left;
width:257px;
height:716px;

}

#shop-top3-journey
{
float:left;
width:263px;
height:716px;

}

#shop-top3-early-DSR
{
float:left;
width:520px;
height:278px;
margin-top:-3px;
}

#shop-top3-early
{
float:left;
width:259px;
height:278px;

}
#shop-top3-DSR
{
float:left;
width:261px;
height:278px;

}

#shop-shopsite
{
float:left;
width:520px;
height:137px;
margin-top:-3px;
}

#shop-menu
{
float:left;
width:520px;
margin-top:-3px;
}

#shop-menu-about
{
float:left;
width:143px;
height:54px;
}

#shop-menu-training
{
float:left;
width:119px;
height:54px;
}

#shop-menu-shop
{
float:left;
width:118px;
height:54px;
}

#shop-menu-contact
{
float:left;
width:140px;
height:54px;
}

#shop-spacer1
{
height:1256px;
width:1px;
float:left;
}

Open in new window

0
 
LVL 7

Author Comment

by:weikelbob
ID: 34898926
I went ahead and posted the code.

I don't have something like ?x=123 on any of the pictures
0
 
LVL 31

Assisted Solution

by:gwkg
gwkg earned 1000 total points
ID: 35096559
Since Facebook is officially depreciating FBML as of tomorrow (March 11) it would make perfect sense to switch to an iframe.

http://www.insidefacebook.com/2011/03/09/fbml-deprecation-canvas-for-post/
0
 
LVL 7

Accepted Solution

by:
weikelbob earned 0 total points
ID: 35097943
gwkg, do you know what the easiest way is to drop in a simple iframe page for free?
0
 
LVL 7

Author Comment

by:weikelbob
ID: 35191681
Woops, I accidentally accepted one of my own comments.

I'll send a note to Community Support
0
 
LVL 7

Author Closing Comment

by:weikelbob
ID: 35225394
Even though FBML is depreciated, we are using a very basic FBML setup and it is working. As you know, facebook is backwards compatible with FBML and I couldn't find a completely free iframe option
0

Featured Post

Ask an Anonymous Question!

Don't feel intimidated by what you don't know. Ask your question anonymously. It's easy! Learn more and upgrade.

Question has a verified solution.

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

Although a lot of people devote their energy toward marketing for specific industries, there are some basic principles that can be applied to any sector imaginable. We’ll look at four steps to take and examine how those steps were put into action fo…
When the s#!t hits the fan, you don’t have time to look up who’s on call, draft emails, call collaborators, or send text messages. An instant chat window is definitely the way to go, especially one like HipChat. HipChat is a true business app. An…
The viewer will learn how to count occurrences of each item in an array.
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).
Suggested Courses

609 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