Meta property content (#578)

* Social Share Preview * LimiteDescription * wip * ATTR.CONTENT * Optimisation de code * change by content * inside the index * wip
SaTT-Wallet · Sep 29, 2023 · d5bc7fc · d5bc7fc
1 parent 5424970
commit d5bc7fc
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 15 deletions.
diff --git a/...n-details/components/campaign-details-container/campaign-details-container.component.html b/...n-details/components/campaign-details-container/campaign-details-container.component.html
@@ -5,15 +5,16 @@
   <meta property="og:description" content="{{ 'campaign?.summary' }}" />
   <meta property="og:image" content="{{ 'ogImageUrl' }}" />
 
-
-  <!-- <meta property="og:title" content="{{ 'campaign?.title'}}" /> -->
-  <!-- <meta property="og:description" content="{{ 'campaign?.summary' }}" /> -->
-  <!-- <meta property="og:image" content="{{ 'ogImageUrl' }}" /> -->
-   <meta property="og:image:width" content="1200" />
+  <!-- <meta property="og:title" [attr.content]="campaign?.title" />
+  <meta property="og:description" [attr.content]="limitDescription(campaign?.summary)" />
+  <meta property="og:image" [attr.content]="ogImageUrl" /> -->
+  <meta property="og:image:width" content="1200" />
   <meta property="og:image:height" content="630" />
+
 </head>
 
 
+
 <ng-container *ngIf="campaign?.id === campaignId; else loading">
   <div class="content" style="min-height: 50vh">
     <router-outlet></router-outlet>

diff --git a/...ign-details/components/campaign-details-container/campaign-details-container.component.ts b/...ign-details/components/campaign-details-container/campaign-details-container.component.ts
@@ -25,9 +25,9 @@ export class CampaignDetailsContainerComponent implements OnInit {
   campaign: any;
   campaignId: any;
   private isDestroyed = new Subject();
+
 
   constructor(
-
     private campaignsStoreService: CampaignsStoreService,
     private route: ActivatedRoute,
     private meta: Meta,
@@ -143,10 +143,15 @@ export class CampaignDetailsContainerComponent implements OnInit {
 
     this.campaign$.pipe(takeUntil(this.isDestroyed)).subscribe((campaign) => {
       this.campaign = campaign;
-
       setTimeout(() => {
         this.showmoonboy = campaign.id === this.campaignId;
       }, 1000);
+      this.meta.updateTag({ property: 'og:title', content: campaign.title });
+      this.meta.updateTag({
+        property: 'og:description',
+        content: campaign.description
+      });
+      this.meta.updateTag({ property: 'og:image', content: this.ogImageUrl });
       /*this.ogImageUrl = campaign.coverSrcMobile.includes('ipfs') ? ipfsURL + campaign.coverSrcMobile.substring(27, campaign.coverSrcMobile.length) : campaign.coverSrcMobile;
       this.meta.updateTag({ property: 'og:title', content: campaign.title });
       this.meta.updateTag({ property: 'og:description', content: campaign.description });

diff --git a/src/index.html b/src/index.html
@@ -27,8 +27,12 @@
     <meta name="apple-mobile-web-app-status-bar-style" content="#1f2337" />
     <meta name="twitter:card" content="summary">
 
+
+   <title>SaTT - Smart advertising Transaction Token</title>
+
     <!-- <title>SaTT - Smart advertising Transaction Token</title> -->
 
+
     <base href="/" />
     <meta
       name="viewport"
@@ -42,14 +46,6 @@
     <meta property="og:image" content="https://satt-token.com/assets/img/share_img_200px.png" />
     <meta property="og:title" content="SaTT - Smart advertising Transaction Token" />
     -->
-    <meta property="og:title" content="{{ 'campaign?.title' }}" />
-    <meta property="og:description" content="{{ 'campaign?.summary' }}" />
-    <meta property="og:image" content="{{ 'ogImageUrl' }}" />
-    <!-- <meta property="og:title" [attr.content]="campaign?.title" />
-    <meta property="og:description" [attr.content]="limitDescription(campaign?.summary)" />
-    <meta property="og:image" [attr.content]="ogImageUrl" /> -->
-    <meta property="og:image:width" content="1200" />
-    <meta property="og:image:height" content="630" />
 
     <meta name="keyword" content="crypto, blockchain, social media, farming,  earning crypto, profitable,  marketing, influencers, brand, SaTT,  token, Trust, wallet">