bloggerblogger-dynamic-views

How do you get the individual post title to be before the blog title?


I am looking to have it so that my post title shows up before my blog name. Currently posts show in previews as 'Blog Name:(post title' but I want it to be '(post title) | Blog Name'. This is the current code:

    <head>
<!-- [ Meta Tag SEO ] -->
<meta charset='utf-8'/>
<meta content='width=device-width, initial-scale=1' name='viewport'/>
<meta content='blogger' name='generator'/>
<meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
<link href='http://www.blogger.com/openid-server.g' rel='openid.server'/>
<link expr:href='data:blog.homepageUrl' rel='openid.delegate'/>
<link expr:href='data:blog.url' rel='canonical'/>
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<title><data:blog.pageTitle/></title>
<b:else/>
<b:if cond='data:blog.pageType != &quot;error_page&quot;'>
<title><data:blog.pageName/> - <data:blog.title/></title>
</b:if></b:if>
<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
<title>Page Not Found - <data:blog.title/></title>
</b:if>
<b:if cond='data:blog.pageType == &quot;archive&quot;'>
<meta content='noindex' name='robots'/>
</b:if>
<b:if cond='data:blog.searchLabel'>
<meta content='noindex,nofollow' name='robots'/>
</b:if>
<b:if cond='data:blog.isMobile'>
<meta content='noindex,nofollow' name='robots'/>
</b:if>

I used Blogger as my platform.

UPDATE Here is he SEO Code, what do I need to change to put my blog title at the end of the post on social shares?

    <!-- [ Social Media Meta Tag ] -->
<b:if cond='data:blog.url == data:blog.homepageUrl'> 
<b:if cond='data:blog.pageType == &quot;item&quot;'> 
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>  
<b:if cond='data:blog.url'>
<meta expr:content='data:blog.url' property='og:url'/>
</b:if>
<meta expr:content='data:blog.title' property='og:site_name'/>
<b:if cond='data:blog.pageName'>
<meta expr:content='data:blog.pageName' property='og:title'/>
</b:if></b:if></b:if></b:if>
<meta expr:content='data:blog.pageTitle' property='og:title'/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<meta content='article' property='og:type'/>
<b:else/>
<meta content='website' property='og:type'/>
</b:if>
<meta expr:content='data:blog.canonicalUrl' property='og:url'/>
<b:if cond='data:blog.postImageUrl'>
<meta expr:content='data:blog.postImageUrl' property='og:image'/>
<b:else/>
<b:if cond='data:blog.postImageThumbnailUrl'>
<meta expr:content='data:blog.postThumbnailUrl' property='og:image'/>
<b:else/>
<meta expr:content='data:blog.blogspotFaviconUrl' property='og:image'/>
</b:if></b:if>
<b:if cond='data:blog.metaDescription'>
<meta expr:content='data:blog.metaDescription' property='og:description'/>
<b:else/>
<meta content='data:blog.metaDescription' property='og:description'/>
</b:if>
<meta expr:content='data:blog.title' property='og:site_name'/>
<meta content='en_US' property='og:locale'/>
<meta content='en_GB' property='og:locale:alternate'/>
<meta content='id_ID' property='og:locale:alternate'/>
<meta content='summary' name='twitter:card'/>
<meta expr:content='data:blog.pageTitle' name='twitter:title'/>
<meta content='xxxxx' name='twitter:site'/>
<meta content='xxxxx' name='twitter:creator'/>
 <meta content='width=device-width,initial-scale=1,minimum-scale=1,maximum
scale=1' name='viewport'/>
    <link href='http://fonts.googleapis.com/css?family=Bad+Script|Raleway:400,500,600,700,300|Lora:400' rel='stylesheet' type='text/css'/>

Solution

  • You need to change meta tags og:title and twitter:title in order to put blog title after post title on social media links

    Replace

    <meta expr:content='data:blog.pageTitle' property='og:title'/>
    <meta expr:content='data:blog.pageTitle' name='twitter:title'/>
    

    With

    <meta expr:content='data:blog.pageName ? data:blog.pageName + " - " + data:blog.title : data:blog.title' property='og:title'/>
    <meta expr:content='data:blog.pageName ? data:blog.pageName + " - " + data:blog.title : data:blog.title' name='twitter:title'/>
    

    You can change dash sign between quotes " - " as you like.

    Your code:

    <!-- [ Social Media Meta Tag ] -->
    <b:if cond='data:blog.url == data:blog.homepageUrl'> 
    <b:if cond='data:blog.pageType == &quot;item&quot;'> 
    <b:if cond='data:blog.pageType == &quot;static_page&quot;'>  
    <b:if cond='data:blog.url'>
    <meta expr:content='data:blog.url' property='og:url'/>
    </b:if>
    <meta expr:content='data:blog.title' property='og:site_name'/>
    <b:if cond='data:blog.pageName'>
    <meta expr:content='data:blog.pageName' property='og:title'/>
    </b:if></b:if></b:if></b:if>
    <meta expr:content='data:blog.pageName ? data:blog.pageName + " - " + data:blog.title : data:blog.title' property='og:title'/>
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <meta content='article' property='og:type'/>
    <b:else/>
    <meta content='website' property='og:type'/>
    </b:if>
    <meta expr:content='data:blog.canonicalUrl' property='og:url'/>
    <b:if cond='data:blog.postImageUrl'>
    <meta expr:content='data:blog.postImageUrl' property='og:image'/>
    <b:else/>
    <b:if cond='data:blog.postImageThumbnailUrl'>
    <meta expr:content='data:blog.postThumbnailUrl' property='og:image'/>
    <b:else/>
    <meta expr:content='data:blog.blogspotFaviconUrl' property='og:image'/>
    </b:if></b:if>
    <b:if cond='data:blog.metaDescription'>
    <meta expr:content='data:blog.metaDescription' property='og:description'/>
    <b:else/>
    <meta content='data:blog.metaDescription' property='og:description'/>
    </b:if>
    <meta expr:content='data:blog.title' property='og:site_name'/>
    <meta content='en_US' property='og:locale'/>
    <meta content='en_GB' property='og:locale:alternate'/>
    <meta content='id_ID' property='og:locale:alternate'/>
    <meta content='summary' name='twitter:card'/>
    <meta expr:content='data:blog.pageName ? data:blog.pageName + " - " + data:blog.title : data:blog.title' name='twitter:title'/>
    <meta content='xxxxx' name='twitter:site'/>
    <meta content='xxxxx' name='twitter:creator'/>
     <meta content='width=device-width,initial-scale=1,minimum-scale=1,maximum
    scale=1' name='viewport'/>
        <link href='http://fonts.googleapis.com/css?family=Bad+Script|Raleway:400,500,600,700,300|Lora:400' rel='stylesheet' type='text/css'/>