SEO and Google listing using title and description meta tag

Wappler General How To
#1

The ‘title’ tag and ‘meta description’ of each page for a site I have developed can be set up by the client through a CMS created in Wappler. These are added to the page head as

{{articlechoice.data.query1[0].articleMetaTitle}}

When the page is indexed by Google the page title is picked up and displays correctly as text in the Search Engine results. However, the description on the Google results page listing which is normally the content of ‘metatag description’ shows as {{articlechoice.data.query1[0].articleMetaDescription}} and not as the correct text.

If you search on Google for treboroughhill.co.uk you will see what the listing looks like with the {{articlechoice.data.query1[0].articleMetaDescription}} where the Google description normally appears.

Is there any way to remedy this?

#2

Hi @magicwebs
How did you bind the value to the meta description tag? Can you paste the code of meta-description here please?

#3

Nevermind, i followed the link you provided.
All you need to do is to change:

<meta name="description" content="{{articlechoice.data.query1[0].articleMetaDescription}}">
<meta name="keywords" content="{{articlechoice.data.query1[0].articleMetaKeywords}}">

to

<meta name="description" dmx-bind:content="{{articlechoice.data.query1[0].articleMetaDescription}}">
<meta name="keywords" dmx-bind:content="{{articlechoice.data.query1[0].articleMetaKeywords}}">

So that the dynamic values can be parsed by app connect on page load.

3 Likes
#4

Hello Teodor

<!doctype html>

{{articlechoice.data.query1[0].articleMetaTitle}}

And so on

Best wishes

Robert

#5

@magicwebs Please check my last reply and make the changes i described, your issue will be fixed then.

#6

Hello Teodor

Many thanks, I having been trying to figure out how to do this properly for days.

Wappler team have made a fantastic piece of software; all your hard work and enthusiasm is very much appreciated. It is such a pleasure to use Wappler compared with hauling through Dreamweaver.

Best wishes

Robert

3 Likes
#7

Thank you for your feedback :slight_smile:
Your site looks great by the way!

#8

This worked for me : moving is=“dmx-app” out of into:

#9

Hello Chris,
You just need to click App in app structure and select whether to apply it on body or on the page, in the properties panel.

1 Like
#10

:sunglasses: Yes! that did it: App tab: app structure: app root: Page

1 Like
#11

How can I have dynamic content in the <title> tag? I’ve tried everything and it’s not having it!

#12

Hi @sitestreet
First you need to click App and select to apply on the page (body is default).
Then any dynamic expression will be rendered between the title tags.

#13

Hi @Teodor. Yep, the page already has lots of dynamic content on there. Adding App Connect is always the first thing I do. I’ve put a binding between the <title> and </title> tags but it just shows the js instead. I’ve also tried to find a dynamic attribute for it but there’s everything except the title tag.

#14

But have you selected to apply it on page or on the body?

#15

What teodor means is to select App in the App Connect Panel and change “App Root” to “Page”.

27%20AM
Screen Shot 2019-11-16 at 10.43.27 AM.png726×1310 117 KB

2 Likes
#16

Aah, I’m with you now. I wondered what that drop down was for. Changed it to Page and it’s working perfectly.

Thanks all.

2 Likes
#17

Talking about SEO, attaching a GTMetrix analysis with great speed results.
With the clean code that Wappler creates it is possible to achieve great SEO results.

dyslexia
dyslexia.jpg1408×865 236 KB

1 Like