Open Graph not showing in WordPress - facebook

It would appear that the WordPress theme that I am working with was not optimized to work with open graph tags. I changed this line of code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" <?php language_attributes(); ?>>
to this:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US" xmlns:og="http://ogp.me/ns#" xmlns:fb="http://www.facebook.com/2008/fbml" <?php language_attributes(); ?>>
When I run the url through the debugging tool on FB, it sees the proper image for the homepage, but that's about the only progress I get. When attempting to share an article it pulls no description or image at all (I use featured images) and the FB Debugger says "document returned no data" when I check to see what the scraper returned for the site.
I have had issues with OG tags before and have, through trial and error, solved the problem. This is really frustrating me. I've even tried adding three plugins at once that would all populate the tags, and then running the debugger, hoping it would give me the error message saying "multiple og tags." It does not. Did I not add the code in my header the correct way?
I will provide my entire header code just in case anyone needs it.
<?php include( TEMPLATEPATH . '/includes/options.php' ); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US" xmlns:og="http://ogp.me/ns#" xmlns:fb="http://www.facebook.com/2008/fbml" <?php language_attributes(); ?>>
<head profile="http://gmpg.org/xfn/11">
<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
<title><?php wp_title('«', true, 'right'); ?> <?php bloginfo('name'); ?></title>
<link rel="stylesheet" href="<?php bloginfo('template_directory'); ?>/css/screen.css" type="text/css" />
<!--[if lte IE 7]><link rel="stylesheet" href="<?php bloginfo('template_directory'); ?>/css/ie.css" type="text/css" media="screen, projection" /><![endif]-->
<!--[if lte IE 6]><link rel="stylesheet" href="<?php bloginfo('template_directory'); ?>/css/ie6.css" type="text/css" media="screen, projection" />
<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/nav.js"></script><![endif]-->
<link rel="alternate" type="application/rss+xml" title="<?php bloginfo('name'); ?> RSS Feed" href="<?php if ( $mb_subscribe_feed ) { echo $mb_subscribe_feed; } else { bloginfo('rss2_url'); } ?>" />
<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
<?php if (is_singular()) wp_enqueue_script('comment-reply'); ?>
<?php wp_head(); ?>
<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/jquery.qtip.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/js/jquery.qtip.style.js"></script>
</head>
<body<?php if ($mb_clean == 1) { echo ' class="clean"'; } ?>>
<!-- header -->
<div id="header"<?php if ($mb_clean == 1) { echo ' class="clean"'; } ?>>
<div id="header-inner">
<div id="header-bottom">
<?php if ($mb_logo == 1) { ?>
<div id="logo-custom" style="width:<?php echo $mb_logo_width; ?>px; height:<?php echo $mb_logo_height; ?>px;"><?php bloginfo('name'); ?><span style="background: url('<?php echo $mb_logo_image; ?>') no-repeat 0 0"> </span></div>
<?php } else { ?>
<div id="logo"<?php if ($mb_clean == 1) { echo ' class="clean"'; } ?>><?php bloginfo('name'); ?><span> </span></div>
<?php } ?>
<?php if ( !$mb_leaderboard ) echo''; else { ?>
<div id="ad-leaderboard">
<?php echo $mb_leaderboard; ?>
</div>
<?php } ?>
<!-- nav -->
<div id="nav">
<div id="navlist">
<?php mb_nav(); ?>
</div>
</div>
<!-- /nav -->
<!-- social -->
<div id="social"<?php if ($mb_clean == 1) { echo ' class="clean"'; } ?>>
<ul>
<?php if ($mb_subscribe_email) { ?><li id="social-email">Email Updates</li><?php } ?>
<?php if ($mb_subscribe_feed) { ?><li id="social-feed">RSS Feed</li><?php } else { ?><li id="social-feed">RSS Feed</li><?php } ?>
<?php if ($mb_social_twitter) { ?><li id="social-twitter">Twitter</li><?php } ?>
<?php if ($mb_social_myspace) { ?><li id="social-myspace">MySpace</li><?php } ?>
<?php if ($mb_social_facebook) { ?><li id="social-facebook">Facebook</li><?php } ?>
</ul>
</div>
<!-- /social -->
</div>
</div>
</div>
<!-- /header -->

First off, the DOCTYPE and opening HTML tags should be separate -- not combined like you have them. See here:
https://www.w3schools.com/tags/tag_doctype.asp
Finally, use a plugin like Complete Open Graph to set up the appropriate prefix and Open Graph tags. It's automatic and should solve your problem, unless you want to continue to fight it manually.
https://wordpress.org/plugins/complete-open-graph/

Related

how to create "send email" button on your own google maps website

Hi everybody :) I have a problem. I would like to make it so that when I enter the address. Click on "Send Email" button to send me an email with "http: //" in the form of a link which opens after pressing the Navigator Maps. My code is here.
<?php
echo "<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Strict//EN' 'http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd'>
<html xmlns='http://www.w3.org/1999/xhtml' dir='ltr' lang='en-us' xml:lang='en-us'>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=utf-8' />
<meta http-equiv='Content-Language' content='en-us' />
<link rel='icon' type='image/gif' href='http://www.nsc.ee/rssimg/favicon.png' />
<link rel='stylesheet' href='contact.css' type='text/css' />
<link rel='stylesheet' href='info.css' type='text/css' />
<script src='http://maps.googleapis.com/maps/api/js?sensor=false&libraries=places'>
http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js'></script>
<script src='js/jquery.geocomplete.js'></script>
<script>
$(function(){
$('#geocomplete').geocomplete({
map: '.map_canvas',
details: 'form ',
markerOptions: {
draggable: true
}
});
$('#geocomplete').bind('geocode:dragged', function(event, latLng){
$('input[name=lat]').val(latLng.lat());
$('input[name=lng]').val(latLng.lng());
$('#reset').show();
});
$('#reset').click(function(){
$('#geocomplete').geocomplete('resetMarker');
$('#reset').hide();
return false;
});
$('#find').click(function(){
$('#geocomplete').trigger('geocode');
}).click();
});
</script>
<script>";
echo"
<form>
<table border='0' bgcolor='#1c1a1a'>
<tr>
<td align='center'><input id='geocomplete' type='text' size='48px' placeholder='Palun sisestage aadress' value='' /><form>
<label><font color=#FFFFFF>Pikkus:</font></label>
<input name='lng' type='text' size='20px' value=''>
<label><font color=#FFFFFF>Laius:</font></label>
<input name='lat' type='text' size='20px' value=''>
<a id='reset' href='#' style='display:none;'></a>
</form></td></tr></table>
<table border='0' bgcolor='#1c1a1a'>
<tr>
<td align='center'><div class='map_canvas'></div></td></tr></table></p>
</form>";
?>

jsp form selection not working

I have following jsp page, when i select MYAP_FORM i expect the hidden form to be displayed but it is not.
Right now i have only one form with display none, i will be adding more and based on the selection will display right one.
Any inputs why i dont see the corresponding form displayed ...
Thanks
<%# page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%# page import="java.io.*"%>
<%#taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%#taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<c:set var="url">${pageContext.request.requestURL}</c:set>
<c:set var="baseURL" value="${fn:replace(url, pageContext.request.requestURI, pageContext.request.contextPath)}" />
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link type="text/css" rel="stylesheet" href="${baseURL}/bootstrap/css/bootstrap.css">
<title>Testing</title>
</head>
<body>
<script src="${baseURL}/bootstrap/js/bootstrap.js"></script>
<form id="platform" class="container text-center">
<select id="myselect">
<option value="" selected="selected"></option>
<option value="MYAP_FORM">MYAP_FORM</option>
<option value="XYZ_FORM">XYZ_FORM</option>
</select>
</form>
<%
String file = application.getRealPath("/") + "xzyFiles.txt";
FileInputStream fis = new FileInputStream(file);
BufferedReader br = new BufferedReader(new InputStreamReader(fis));
String tmp;
out.println("<form class=\"container\" id=\"MYAP_FORM\" style=\"display:none\">");
while ((tmp = br.readLine()) != null) {
out.print("<label class=\"checkbox text-left\">");
out.print("<input type=\"checkbox\" id=\"" + tmp +"\" value=\"1\">" + tmp + "</BR>");
out.print("</label>");
}
fis.close();
out.println("<button class=\"btn btn-primary\">Submit</button>");
out.println("<button class=\"btn btn-primary\">Clear</button>");
out.println("</form>");
%>
<script>
$("#myselect").on("change", function() {
$("#" + $(this).val()).show();
})
</script>
</body>
</html>
JQuery Script was missing, once added it worked fine.

form submit button not working when view is using master layout

Following my previous question, now things are not working again, here it goes:
I have form in MVC 4, and the form button does not respond:
Controller (that should get the post action):
public class GeneralController {
[HttpPost]
public ActionResult SearchResults(SearchParamsModel searchParams)
{
// doin some stuff here
return View("SearchResultsView");
}
}
View (.cshtml):
#model MVC.Models.SearchParamsModel
#{
ViewBag.Title = "SomeTitle";
}
#Html.Partial("~/Views/SomePartials/ssi-header.cshtml");
#Html.Partial("~/Views/SomePartials/ssi-sidebar-notifications.cshtml");
<!-- content -->
<section class="content right">
<section class="some-search">
<div class="form-separator gradient"></div>
#using (Html.BeginForm("SearchResults", "Home", FormMethod.Post))
{
<section class="form-field">
<input type="text" name="City" id="City" class="field field139 autocomplete-init-no-img" />
<label for="City">City</label>
</section>
<input type="submit" value="Submit Search" class="submit btn blue-btn special-submit" />
}
</section>
</section>
<!-- end content -->
#Html.Partial("~/Views/SomePartials/ssi-footer.cshtml");
Model :
public class SearchParamsModel
{
public string City{ get; set; }
}
Things are only working if I add in View : Layout = null (!!!Wierd)
My Layout
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>#ViewBag.Title - My ASP.NET MVC Application</title>
<link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
<meta name="viewport" content="width=device-width" />
#Styles.Render("~/Content/SomeStyles")
#*#Scripts.Render("~/bundles/SomeScripts")*#
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="../../Scripts/script1.js" type="text/javascript"></script>
<script src="../../Scripts/script2.js"></script>
....
</head>
<body>
<div id="body">
#RenderSection("featured", required: false)
<section class="content-wrapper main-content clear-fix">
#RenderBody()
</section>
</div>
#*#RenderSection("scripts", required: false)*#
</body>
</html>
Like the answer in your previous question you should post to General controller and not Home controller.
#using (Html.BeginForm("SearchResults", "General", FormMethod.Post))
Cheers.

How make fancybox working with symfony framework?

I am using symfony 1.4. I would like to ask you for a help with fancy box. How can i make that fancy gallery after click on my image. Please.
Well i tried do something like that:
in apps/fronted/config/viey.yml
javascripts: [jquery-1.4.3.min.js, jquery.fancybox-1.3.4.js]
also put that files in css folder web/js
in apps/fronted/config/templates/layout.php i leave it with no changes
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//PL" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl">
<head>
<?php include_http_metas() ?>
<?php include_metas() ?>
<?php include_title() ?>
<?php include_stylesheets() ?>
<?php include_javascripts() ?>
</head>
<body>
<div id="container">
<div class="content">
<?php echo $sf_content ?>
</div>
</div>
</body>
in apps/fronted/modules/myshop/templates/homeSuccess.php i wrote
<a id="single_image" href="images/braceles/1.jpg">
<img src="images/braceles/1.jpg" alt=""/></a>
after that i click on image, it redirect me to page with image instead that fancy view :( i don't get it, what is that "single_image" and what do i do wrong?
Please help me, thanks user! :)
I use fansybox like :
In apps/fronted/config/view.yml
javascripts: [jquery-1.6.2.min.js,fancybox/jquery.fancybox-1.3.4.js,fancybox/jquery.easing-1.3.pack.js,fancybox/jquery.mousewheel-3.0.4.pack.js,fancybox/fancyconfig.js]
stylesheets: [fancybox/jquery.fancybox-1.3.4.css]
In my fancyconfig.js
$(document).ready(function(){
$("a#image_fancybox").fancybox({
'titlePosition' : 'over',
'overlayOpacity' : 0.4
});
});
In my apps/fronted/modules/mymod/templates/indexSuccess.php
<a id="image_fancybox" title="<?php echo $project->getDescription()?>" href="<?php echo "/uploads/projects/".$project->getImage() ?>"> <img src="<?php echo "/uploads/projects/thumbnails/thumb_".$project->getImage() ?>" alt="<?php echo $project->getDescription() ?>"/></a>
So, it is work. You can use firebug in firefox , that debug you js code.

Zend_Navigation menu works but not breadcrumbs

I have configured my zend navigation menu like
Config: http://pastebin.com/B212uWKz
public function _initNavigation() {
$config = new Zend_Config_Xml(APPLICATION_PATH . '/configs/navigation.xml', 'nav');
$navigation = new Zend_Navigation($config);
$this->bootstrap('view');
$view = $this->getResource('view');
$view->navigation($navigation);
}
Layout
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>Zend Navigation Test</title>
</head>
<body>
<?php echo $this->navigation()->menu(); ?>
<hr />
<?php echo $this->navigation()->breadcrumbs(); ?>
<hr />
<?php echo $this->layout()->content; ?>
</body>
</html>
The menu works but not the breadbrumbs. I also tried from here
<?php echo $this->navigation()->breadcrumbs()
->setLinkLast(false)
->setMinDepth(0)
->render(); ?>
Still only the menu works
Maybe they use different containers?
Maybe max depth?
<?php echo $this->navigation()->breadcrumbs()
->setLinkLast(false)
->setMinDepth(0)
->setMaxDepth(500)
->render($this->navigation()->getContainer()); ?>
Looking at your code I think that the problem might be because you use uri tags rather then controller and action tags. For instance instead of:
<home>
<label>Home</label>
<uri>/</uri>
</home>
there should be:
<home>
<label>Home</label>
<controller>index</controller>
<action>index</action>
</home>
Hope it will work for you.