Hugo sites doesn’t display og:image and og:description - meta-tags

og:image and og:description not appearing in whatsapp and fb share,
repo link
https://github.com/TenSketch/Prabhat
I tried to keep og:image at 300*300,
tried clearing caches
here is the code
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=egde">
<meta name="viewport" content="width=device-width, initial-scale=1 shrink-to-fit=no">
<meta name="generator" content="Hugo 0.55.6">
<title>{{ if .Title }}{{ .Title }}{{ end }}</title>
{{ if .Params.Description }}
<meta name="description" content="{{ .Params.Description }}">
{{ else if .Site.Params.Description }}
<meta name="description" content="{{ .Site.Params.Description }}">
{{ end }}
{{ if .Params.Keywords }}
<meta name="keywords" content="{{ .Params.Keywords }}">
{{ else if .Site.Params.Keywords }}
<meta name="keywords" content="{{ .Site.Params.Keywords }}">
{{ end }}
<!-- og meta tags -->
<meta property="og:url" content="{{.Site.BaseURL}}">
<meta property="og:image" content="{{.Site.BaseURL}}images/ogimage.png">
{{ if .Params.Description }}
<meta property="og:description" content="{{ .Params.Description }}">
{{ else if .Site.Params.Description }}
<meta property="og:description" content="{{ .Site.Params.Description }}">
{{ end }}
{{ if .Params.Keywords }}
<meta property="og:keywords" content="{{ .Params.Keywords }}">
{{ else if .Site.Params.Keywords }}
<meta property="og:keywords" content="{{ .Site.Params.Keywords }}">
{{ end }}
<!-- favicons -->
<link rel="apple-touch-icon" sizes="57x57" href="/images/favicons/apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="/images/favicons/apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="/images/favicons/apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="/images/favicons/apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="/images/favicons/apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="/images/favicons/apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="/images/favicons/apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="/images/favicons/apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="/images/favicons/apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="/images/favicons/android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="/images/favicons/favicon-32x32.png">
<link rel="manifest" href="/images/favicons/manifest.json">
<meta name="msapplication-TileColor" content="#ffffff">
<meta name="msapplication-TileImage" content="/images/favicons/ms-icon-144x144.png">
<meta name="theme-color" content="#ffffff">
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="/css/bootstrap.min.css">
<link rel="stylesheet" href="/fontawesome-free-5.9.0-web/css/all.min.css">
<link rel="stylesheet"
href="https://fonts.googleapis.com/css?family=Nunito:200,200i,300,300i,400,400i,600,600i,700,700i,800,800i,900,900i">
<link rel="stylesheet"
href="https://fonts.googleapis.com/css?family=Nunito:200,200i,300,300i,400,400i,600,600i,700,700i,800,800i,900,900i">
<link rel="stylesheet" href="/css/grayscale.css">
<link rel="stylesheet" href="/fancybox-2.1.7/jquery.fancybox.min.css">
</head>
Kindly help me with this, all my hugo sites are like this

Here is the answer:
I added og_image = "images/og_image.png" to the config.toml file and,
The below code in partials/head.html
<title>{{ if .Title }}{{ .Title }}{{ end }}</title>
{{ if .Params.Description }}
<meta name="description" content="{{ .Params.Description }}">
{{ else if .Site.Params.Description }}
<meta name="description" content="{{ .Site.Params.Description }}">
{{ end }}
{{ if .Params.Keywords }}
<meta name="keywords" content="{{ .Params.Keywords }}">
{{ else if .Site.Params.Keywords }}
<meta name="keywords" content="{{ .Site.Params.Keywords }}">
{{ end }}
<!-- og meta tags -->
<meta property="og:title" content="{{ if .Title }}{{ .Title }}{{ end }}">
<meta property="og:type" content="website">
<meta property="og:url" content="{{.Site.BaseURL}}">
{{ if .Params.Description }}
<meta property="og:description" content="{{ .Params.Description }}">
{{ else if .Site.Params.Description }}
<meta property="og:description" content="{{ .Site.Params.Description }}">
{{ end }}
{{ if .Params.Keywords }}
<meta property="og:keywords" content="{{ .Params.Keywords }}">
{{ else if .Site.Params.Keywords }}
<meta property="og:keywords" content="{{ .Site.Params.Keywords }}">
{{ end }}
{{ if .Params.og_image }}
<meta property="og:image" content="{{.Site.BaseURL}}{{ .Params.og_image | relURL
}}" />
<meta property="og:image:secure_url" content="{{ .Params.og_image | absURL }}" />
{{ else }}
<meta property="og:image" content="{{.Site.BaseURL}}{{ .Site.Params.og_image |
relURL }}" />
<meta property="og:image:secure_url" content="{{ .Site.Params.og_image | absURL }}"
/>
{{ end }}
(og_image location: themes/yourtheme/static/images/og_image.png)
My website link for sample:
https://www.tensketch.com/
WhatsApp preview og_image
References:
https://gohugo.io/
https://discourse.gohugo.io/

Related

Error: Rocket failed to launch due to failing fairings:

I am just learning Rust's Rocket however when I compile the code, I get errors mentioned below. I am just trying to pass values to my templates variable from my rust file.
I have a src/main.rs file with following code:
#[macro_use] extern crate rocket;
use rocket_dyn_templates::{Template, context};
#[get("/")]
fn home() -> Template{
Template::render("index",context!{
title : "Hello, World",
logged_in : true,
user_name: "test"
})
}
#[launch]
fn rocket() -> _ {
rocket::build()
.mount("/", routes![home])
.attach(Template::fairing())
}
Inside templates/index.html.tera I following code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{{title}}</title>
</head>
<body>
<header>
<nav>
<div>
<h1>Test</h1>
</div>
<!-- Add navigation bar here !-->
<ul>
<li>
About
</li>
<li>
Edit Page
</li>
<li>
{% if logged_in %}
{{user_name}}
{% else %}
Login
</li>
</ul>
</nav>
</header>
<main>
<!-- Provide Title for your page here !-->
<h1>{{title}}</h1>
</main>
however when i compile the code i am greeted with following errors:
41 | </html>
| ^---
|
= expected tag or some content
Template initialization failed. Aborting launch.
Error: Rocket failed to launch due to failing fairings:
Templating
thread 'main' panicked at 'aborting due to fairing failure(s)',
I think you are forgetting to close some tags in the html/Tera code and that is why you are getting this error.
You are forgetting to close body, html, and the {% endif %} for the structure control
I modified the html code to something like this:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{{title}}</title>
</head>
<body>
<header>
<nav>
<div>
<h1>Test</h1>
</div>
<!-- Add navigation bar here !-->
<ul>
<li>
About
</li>
<li>
Edit Page
</li>
<li>
{% if logged_in %}
{{user_name}}
{% else %}
Login
{% endif %}
</li>
</ul>
</nav>
</header>
<main>
<!-- Provide Title for your page here !-->
<h1>{{title}}</h1>
</main>
</body>
</html>
and it works now

ValueError: "<User: harry1>" needs to have a value for field "id" before this many-to-many relationship can be used in Django

I need help with Django web Framework I cannot solve this problem or I cannot identify the source of the problem. Please help me with this problem the main problem is written in the title.
Here is my traceback for the error:
Traceback (most recent call last):
File "C:\Users\Admin\AppData\Local\Programs\Python\Python39\lib\site-packages\django\core\handlers\exception.py", line 47, in inner
response = get_response(request)
File "C:\Users\Admin\AppData\Local\Programs\Python\Python39\lib\site-packages\django\core\handlers\base.py", line 181, in _get_response
response = wrapped_callback(request, *callback_args, **callback_kwargs)
File "D:\Documents\CodingFox\CodingFox_final\CodingFox\Users\views.py", line 37, in registeration_form
form.save()
File "D:\Documents\CodingFox\CodingFox_final\CodingFox\Users\forms.py", line 18, in save
user = super().save(*args, **kwargs)
File "C:\Users\Admin\AppData\Local\Programs\Python\Python39\lib\site-packages\django\contrib\auth\forms.py", line 131, in save
user.save()
File "C:\Users\Admin\AppData\Local\Programs\Python\Python39\lib\site-packages\django\db\models\fields\related_descriptors.py", line 536, in __get__
return self.related_manager_cls(instance)
File "C:\Users\Admin\AppData\Local\Programs\Python\Python39\lib\site-packages\django\db\models\fields\related_descriptors.py", line 851, in __init__
raise ValueError('"%r" needs to have a value for field "%s" before '
ValueError: "<User: harry1>" needs to have a value for field "id" before this many-to-many relationship can be used.
Models.py file
from django.db import models
from django.utils import timezone
from django.contrib.auth.models import User
from django.urls import reverse
import cv2
class Profile(models.Model):
user =models.OneToOneField(User, on_delete=models.CASCADE)
cover_img = models.ImageField(default='default.png',upload_to='cover_pics')
image = models.ImageField(default='default.jpg',upload_to='profile_pics')
# bio = models.TextField()
def __str__(self):
return f'{self.user.username} Profile'
def save(self ,*args, **kwargs):
super(Profile, self).save( *args, **kwargs)
img = cv2.imread(self.image.path)
output_size = cv2.resize(img,(300,300))
cv2.imwrite(self.image.path, output_size)
Forms.py
from django import forms
from django.contrib.auth.models import User
from django.contrib.auth.forms import UserCreationForm, AuthenticationForm
from django.forms import models
from .models import Profile
class UserRegistrationForm(UserCreationForm):
email=forms.EmailField(required=False)
class Meta:
model = User
fields = ['username','email','password1','password2']
class ProfileUpdateForm(forms.ModelForm):
class Meta:
model = Profile
fields = ['cover_img','image']
class UserLoginForm(AuthenticationForm):
class Meta:
model = User
fields = ['username','password']
Base.html
{% load static %}
{% load crispy_forms_tags %}
<!DOCTYPE html>
<html lang="en">
<head>
{% block head %}
{% endblock head %}
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="title" content="CodingFox: Pre Written Code snippets">
<meta name="description"
content="CodingFox can enhance the speed of programming by giving them pre-written code snippets.">
<meta property="og:type" content="website">
<meta property="og:url" content="https://CodingFox.com/">
<meta property="og:title" content="CodingFox: Pre Written Code snippets">
<meta property="og:description"
content="CodingFox can enhance the speed of programming by giving them pre-written code snippets.">
<meta property="og:image" content="resoures/img/For_website.png">
<meta property="twitter:card" content="summary_large_image">
<meta property="twitter:url" content="https://CodingFox.com/">
<meta property="twitter:title" content="CodingFox: Pre Written Code snippets">
<meta property="twitter:description"
content="CodingFox can enhance the speed of programming by giving them pre-written code snippets.">
<meta property="twitter:image" content="resoures/img/For_website.png">
<link rel="stylesheet" href="{% static 'vendors/css/1.3 grid.css.css' %}">
<link href="https://unpkg.com/ionicons#4.5.10-0/dist/css/ionicons.min.css" rel="stylesheet">
<link rel="stylesheet" href="{% static 'vendors/css/normalize.css' %}">
<link rel="stylesheet" href="{% static 'vendors/css/prism-1.css' %}">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Lato:wght#100;300;400;700;900&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="apple-touch-icon" sizes="57x57" href="{% static 'favicon/apple-icon-57x57.png' %}">
<link rel="apple-touch-icon" sizes="60x60" href="{% static 'favicon/apple-icon-60x60.png' %}">
<link rel="apple-touch-icon" sizes="72x72" href="{% static 'favicon/apple-icon-72x72.png' %}">
<link rel="apple-touch-icon" sizes="76x76" href="{% static 'favicon/apple-icon-76x76.png' %}">
<link rel="apple-touch-icon" sizes="114x114" href="{% static 'favicon/apple-icon-114x114.png' %}">
<link rel="apple-touch-icon" sizes="120x120" href="{% static 'favicon/apple-icon-120x120.png' %}">
<link rel="apple-touch-icon" sizes="144x144" href="{% static 'favicon/apple-icon-144x144.png' %}">
<link rel="apple-touch-icon" sizes="152x152" href="{% static 'favicon/apple-icon-152x152.png' %}">
<link rel="apple-touch-icon" sizes="180x180" href="{% static 'favicon/apple-icon-180x180.png' %}">
<link rel="icon" type="image/png" sizes="192x192" href="{% static 'favicon/android-icon-192x192.png' %}">
<link rel="icon" type="image/png" sizes="32x32" href="{% static 'favicon/favicon-32x32.png' %}">
<link rel="icon" type="image/png" sizes="96x96" href="{% static 'favicon/favicon-96x96.png' %}">
<link rel="icon" type="image/png" sizes="16x16" href="{% static 'favicon/favicon-16x16.png' %}">
<link rel="manifest" href="{% static 'favicon/manifest.json' %}">
<meta name="msapplication-TileColor" content="#ffffff">
<meta name="msapplication-TileImage" content="{% static 'favicon/ms-icon-144x144.png' %}">
<meta name="theme-color" content="#ffffff">
<script src="{% static 'vendors/js/prism-1.js' %}"></script>
</head>
<body>
<nav>
<img src="{% static 'resoures/img/For_website.png' %}" alt="Logo_img" />
<div class="ion-md-menu nav_icon" id="nav_clickable"></div>
{% if user.is_authenticated %}
<div class="nav_icon-link">New Post</div>
<div class="nav_icon-link"><span class="ion-md-search"></span></div>
{% else %}
<div class="nav_icon-link">Login</div>
<div class="nav_icon-highlight">Register</div>
{% endif %}
<div class="clearfix"></div>
<div class="nav_box" id="nav_box">
{% if user.is_authenticated %}
<a href="" class="nav_box-link--person_img"><img src="{{ user.profile.image.url }}" alt="person-img"
srcset="" /></a>
<span class="ion-md-home"></span> {{ user.username }}
{% else %}
{% comment %} Unknown {% endcomment %}
{% endif %}
<span class="ion-md-moon"></span> Theme
<div class="nav_box-theme_box" id="theme_box">
<p>Change the color scheme to Dark colors.</p>
<h4>Toggle Theme</h4>
<input type="checkbox" name="" id="nav_box-theme_box-checkbox" />
</div>
<span class="ion-md-code"></span> Languages
<ul class="nav_box_language_box" id="lang_box">
<li>
<span class="ion-logo-html5"> HTML</span>
</li>
<li>
<span class="ion-logo-css3"> CSS</span>
</li>
<li>
<span class="ion-logo-python"> Python</span>
</li>
<li>
<span class="ion-logo-javascript"> JavaScript</span>
</li>
</ul>
{% if user.is_authenticated %}
<span class="ion-md-options"></span> Settings
<span class="ion-md-save"></span> Saved Posts
{% comment %} <span class="ion-md-home"></span> Home {% endcomment %}
<hr />
<span class="ion-md-log-out"></span> Log out
{% else %}
<span class="ion-md-log-in"></span> Login
<hr />
<span class="ion-md-person-add"></span> Register
{% endif %}
</div>
</nav>
<div class="message-box">
{% if messages %}
<ul class="messages">
{% for message in messages %}
<li{% if message.tags %} class="{{ message.tags }}"{% endif %}>
{% if message.level == DEFAULT_MESSAGE_LEVELS.ERROR %}Important: {% endif %}
{{ message }}
</li>
{% endfor %}
</ul>
{% endif %}
</div>
{% block category %}
{% endblock category %}
{% block Post_loading %}
{% endblock Post_loading %}
{% block post %}
{% endblock post %}
<script src="https://code.jquery.com/jquery-3.6.0.min.js"
integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
<script src="{% static 'resoures/js/script.js' %}"></script>
<script src="{% static 'resoures/js/script-jquery.js' %}"></script>
<script src="{% static 'vendors/js/jquery.waypoints.min.js' %}"></script>
</body>
</html>
signup_form.html
{% extends 'base.html' %}
{% load static %}
{% load crispy_forms_tags %}
<head>
{% block head %}
<title>CodingFox | Register</title>
<link rel="stylesheet" href="{% static 'resoures/css/login.css' %}" />
{% endblock head %}
</head>
<body>
{% block post %}
<form action="" method="post" class="signup_form">
{% csrf_token %}
<h1>Welcome New User!</h1>
{% comment %} <label for="signup_email">Email :</label>
<input type="email" name="email" id="email">
<label for="signup_username">Username :</label>
<input type="text" name="username" id="username">
<label for="signup_password">Password :</label>
<input type="password" name="password" id="password"> {% endcomment %}
{{ form|crispy }}
{% comment %} <h4>Forgot Password?</h4> {% endcomment %}
<input type="submit" value="Register">
<hr>
<p>Already have a account?</p>
Login
</form>
{% endblock post %}
</body>
Views.py
def registeration_form(request):
if request.method == 'POST':
form=UserRegistrationForm(request.POST)
if form.is_valid():
form.save()
username=form.cleaned_data.get('username')
messages.success(request,f'Account created for {username}!')
return redirect('login_page')
else:
form=UserRegistrationForm()
context = {
'title':'Register',
'form':form
}
return render(request,'signup_form.html',context)
Urls.py
from django.contrib import admin
from django.urls import path, include
from . import views
urlpatterns = [
path('register/',views.registeration_form, name='register_page'),
]
Can you please give me a solution? This thing just worked a week ago but it's giving errors now. It is also giving errors for creating Post.

EventReservation won't reschedule/cancel

I can schedule events using gMail markup, but...
If I attempt to reschedule an event, it just makes a second copy at the new time, and leaves the original event intact.
If I attempt to cancel an event, nothing happens.
An example of what my confirmation looks like:
<div itemscope="" itemtype="http://schema.org/EventReservation">
<meta itemprop="reservationId" content="Example967585">
<link itemprop="reservationStatus" href="http://schema.org/ReservationConfirmed">
<div itemprop="underName" itemscope="" itemtype="http://schema.org/Person">
<meta itemprop="name" content="Sam Brown">
</div>
<div itemprop="reservationFor" itemscope="" itemtype="http://schema.org/Event">
<meta itemprop="name" content="The Return of the Sam Exclusive Experience">
<meta itemprop="eventStatus" content="http://schema.org/EventScheduled">
<meta itemprop="startDate" content="2019-12-20T10:00:00-08:00">
<meta itemprop="endDate" content="2019-12-20T11:00:00-08:00">
<div itemprop="location" itemscope="" itemtype="http://schema.org/Place">
<meta itemprop="name" content="851 81st Avenue">
<div itemprop="address" itemscope="" itemtype="http://schema.org/PostalAddress">
<meta itemprop="streetAddress" content="851 81st Avenue">
<meta itemprop="addressLocality" content="San Francisco">
<meta itemprop="addressRegion" content="CA">
<meta itemprop="postalCode" content="94105">
<meta itemprop="addressCountry" content="SE">
</div>
</div>
</div>
</div>
Here's a sample reschedule markup:
<div itemscope="" itemtype="http://schema.org/EventReservation">
<meta itemprop="reservationId" content="Example967585">
<link itemprop="reservationStatus" href="http://schema.org/ReservationConfirmed">
<div itemprop="underName" itemscope="" itemtype="http://schema.org/Person">
<meta itemprop="name" content="Sam Brown">
</div>
<div itemprop="reservationFor" itemscope="" itemtype="http://schema.org/Event">
<meta itemprop="name" content="The Return of the Sam Exclusive Experience">
<meta itemprop="eventStatus" content="http://schema.org/EventRescheduled">
<meta itemprop="startDate" content="2019-12-21T10:00:00-08:00">
<meta itemprop="endDate" content="2019-12-21T11:00:00-08:00">
<div itemprop="location" itemscope="" itemtype="http://schema.org/Place">
<meta itemprop="name" content="851 81st Avenue">
<div itemprop="address" itemscope="" itemtype="http://schema.org/PostalAddress">
<meta itemprop="streetAddress" content="851 81st Avenue">
<meta itemprop="addressLocality" content="San Francisco">
<meta itemprop="addressRegion" content="CA">
<meta itemprop="postalCode" content="94105">
<meta itemprop="addressCountry" content="SE">
</div>
</div>
</div>
<meta itemprop="modifiedTime" content="2019-12-19T15:15:40-08:00">
</div>
Finally, a sample cancellation markup:
<div itemscope="" itemtype="http://schema.org/EventReservation">
<meta itemprop="reservationId" content="Example967585">
<link itemprop="reservationStatus" href="http://schema.org/ReservationCancelled">
<div itemprop="underName" itemscope="" itemtype="http://schema.org/Person">
<meta itemprop="name" content="Sam Brown">
</div>
<div itemprop="reservationFor" itemscope="" itemtype="http://schema.org/Event">
<meta itemprop="name" content="The Return of the Sam Exclusive Experience">
<meta itemprop="eventStatus" content="http://schema.org/EventCancelled">
<meta itemprop="startDate" content="2019-12-21T10:00:00-08:00">
<meta itemprop="endDate" content="2019-12-21T11:00:00-08:00">
<div itemprop="location" itemscope="" itemtype="http://schema.org/Place">
<meta itemprop="name" content="851 81st Avenue">
<div itemprop="address" itemscope="" itemtype="http://schema.org/PostalAddress">
<meta itemprop="streetAddress" content="851 81st Avenue">
<meta itemprop="addressLocality" content="San Francisco">
<meta itemprop="addressRegion" content="CA">
<meta itemprop="postalCode" content="94105">
<meta itemprop="addressCountry" content="SE">
</div>
</div>
</div>
<meta itemprop="modifiedTime" content="2019-12-19T15:26:23-08:00">
</div>
Other than being run through a translator to take them out of Quoted Printable format, those are live examples, cut&pasted directly from the eMails they were sent through.
All three markups pass the testing tool at:
https://search.google.com/structured-data/testing-tool#
A subset of the things I've tried:
Using the sample code from the markup page.
Updating that code to the newest versions I can find at schema.org.
** e.g. Changing reservationNumber to reservationId.
** e.g. Changing the reservation status to match the ReservationStatus types shown on schema.org rather than the versions from the markup tutorial page.
Testing by eMailing the markup to myself, using the markup email testing script at https://developers.google.com/gmail/markup/apps-script-tutorial and the sample code from the markup eventReservation page.
Swapping from the microdata example to the json+ld example when using that self test script.
I'm stumped for more things to try.
Google has confirmed via eMail that cancelling events and removing duplicate events after a reschedule was removed as a feature in December.
I've asked them to update their documentation.

I'm having trouble horizontally centering my h1 with zurb flexbox

I'm new to flexbox, and I've tried applying align-center to the row class but, the h1 will not center. Could someone give me a hand with this, and explain to me why the align center is not working? Here is a code pen Codepen
<!doctype html>
<html class="no-js" lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Foundation for Sites</title>
<link rel="stylesheet" href="css/foundation.css">
<link rel="stylesheet" href="css/app.css">
</head>
<body>
<div class='header-section'>
<div class='title-bar' data-responsive-toggle='menu' data-hide-for='medium'>
<button class='menu-icon' type='button' data-toggle></button>
<div class='title-bar-title'>Menu</div>
</div>
<div class='top-bar' id='menu'>
<div class='top-bar-left'>
<ul class='dropdown vertical medium-horizontal menu' data-dropdown-menu>
<li class='menu-text'>The American Dream</li>
<li>Home</li>
<li>About</li>
<li>Contact</li>
</ul>
</div>
</div>
</div>
<div class='main-content'>
<div class='row'>
<div class='small-12 column'>
<h1>And...Then, ZANG!</h1>
</div>
</div>
</div>
<script src="js/vendor/jquery.js"></script>
<script src="js/vendor/what-input.js"></script>
<script src="js/vendor/foundation.js"></script>
<script src="js/app.js"></script>
</body>
</html>

google search doesn't show correct title and description

Please search google for amirkabir data miners
Check Title and Description for https://adm-co.net
As you can see in page source, google show Amirkabir Data Miners: داده کاوان امیرکبیر instead of داده کاوان امیرکبیر | Amirkabir Data Miners and completely wrong description.
I registered site in Google Webmaster Tools, and Google Analytics and tried anything.
What do i have to do!?
<title>داده کاوان امیرکبیر | Amirkabir Data Miners</title>
<meta charset="utf-8" />
<link rel="apple-touch-icon" sizes="57x57" href="/Content/images/favicons/apple-touch-icon-57x57.png">
<link rel="apple-touch-icon" sizes="114x114" href="/Content/images/favicons/apple-touch-icon-114x114.png">
<link rel="apple-touch-icon" sizes="72x72" href="/Content/images/favicons/apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" sizes="144x144" href="/Content/images/favicons/apple-touch-icon-144x144.png">
<link rel="apple-touch-icon" sizes="60x60" href="/Content/images/favicons/apple-touch-icon-60x60.png">
<link rel="apple-touch-icon" sizes="120x120" href="/Content/images/favicons/apple-touch-icon-120x120.png">
<link rel="apple-touch-icon" sizes="76x76" href="/Content/images/favicons/apple-touch-icon-76x76.png">
<link rel="apple-touch-icon" sizes="152x152" href="/Content/images/favicons/apple-touch-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="/Content/images/favicons/apple-touch-icon-180x180.png">
<link rel="icon" type="image/png" href="/Content/images/favicons/favicon-192x192.png" sizes="192x192">
<link rel="icon" type="image/png" href="/Content/images/favicons/favicon-160x160.png" sizes="160x160">
<link rel="icon" type="image/png" href="/Content/images/favicons/favicon-96x96.png" sizes="96x96">
<link rel="icon" type="image/png" href="/Content/images/favicons/favicon-16x16.png" sizes="16x16">
<link rel="icon" type="image/png" href="/Content/images/favicons/favicon-32x32.png" sizes="32x32">
<meta name="msapplication-TileColor" content="#e3e3e3">
<meta name="msapplication-TileImage" content="/mstile-144x144.png">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0' name='viewport' />
<meta name="description" content="شرکت داده کاوان امیرکبیر | تولید کننده نرم افزارهای تحت وب، از قبیل حسابداری آنلاین 'کاج سیستم' ، سیستم مدیریت پروژه 'تسک من' و ...">
<meta name="keywords" content="شرکت داده کاوان امیرکبیر,شرکت,داده,کاوان,امیرکبیر,حسابداری, سیستم های تحت وب, برنامه نویسی,حسابداری آنلاین,سیستم های تحت وب, طراحی نرم افزار, adm, amikabir, data, miners, amirkabir data miners, adm (amirkabir data miners), programming, financial, taskman, taskmanager, web application, web, application">
<meta name="language" content="fa">
<meta name="robots" content="all" />
<meta name="rights" content="Copyright © 2015 ADM-CO - All rights reserved">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
Many are getting similar kind of issues, Before Google has automatically set the Meta description when it is not presented in the site. It sets the description as per the search query and based on the content in the website.
Now the Google does the same for the Meta Title and Meta Description even though it is presented in the website.

Resources