Merge branch 'feat/0.6.0/seo' into test

internal/base/server/http.go

@@ -13,6 +13,7 @@ import (
 	"github.com/answerdev/answer/internal/schema"
 	"github.com/answerdev/answer/pkg/converter"
 	"github.com/answerdev/answer/pkg/day"
+	"github.com/answerdev/answer/pkg/htmltext"
 
 	brotli "github.com/anargu/gin-brotli"
 	"github.com/answerdev/answer/internal/base/middleware"
@@ -160,6 +161,9 @@ func NewHTTPServer(debug bool,
 				"timezone": tz,
 			}
 		},
+		"urlTitle": func(title string) string {
+			return htmltext.UrlTitle(title)
+		},
 	}
 	r.SetFuncMap(funcMap)
 

internal/controller/template_controller.go

@@ -98,9 +98,15 @@ func (tc *TemplateController) Index(ctx *gin.Context) {
 
 	siteInfo := tc.SiteInfo(ctx)
 	siteInfo.Canonical = fmt.Sprintf("%s", siteInfo.General.SiteUrl)
+
+	UrlUseTitle := false
+	if siteInfo.General.PermaLink == schema.PermaLinkQuestionIDAndTitle {
+		UrlUseTitle = true
+	}
 	tc.html(ctx, http.StatusOK, "question.html", siteInfo, gin.H{
-		"data": data,
-		"page": templaterender.Paginator(page, req.PageSize, count),
+		"data":     data,
+		"useTitle": UrlUseTitle,
+		"page":     templaterender.Paginator(page, req.PageSize, count),
 	})
 }
 
@@ -121,9 +127,15 @@ func (tc *TemplateController) QuestionList(ctx *gin.Context) {
 	siteInfo := tc.SiteInfo(ctx)
 	siteInfo.Canonical = fmt.Sprintf("%s/questions", siteInfo.General.SiteUrl)
 
+	UrlUseTitle := false
+	if siteInfo.General.PermaLink == schema.PermaLinkQuestionIDAndTitle {
+		UrlUseTitle = true
+	}
+
 	tc.html(ctx, http.StatusOK, "question.html", siteInfo, gin.H{
-		"data": data,
-		"page": templaterender.Paginator(page, req.PageSize, count),
+		"data":     data,
+		"useTitle": UrlUseTitle,
+		"page":     templaterender.Paginator(page, req.PageSize, count),
 	})
 }
 
@@ -310,10 +322,16 @@ func (tc *TemplateController) TagInfo(ctx *gin.Context) {
 	}
 	siteInfo.Keywords = taginifo.DisplayName
 
+	UrlUseTitle := false
+	if siteInfo.General.PermaLink == schema.PermaLinkQuestionIDAndTitle {
+		UrlUseTitle = true
+	}
+
 	tc.html(ctx, http.StatusOK, "tag-detail.html", siteInfo, gin.H{
 		"tag":           taginifo,
 		"questionList":  questionList,
 		"questionCount": questionCount,
+		"useTitle":      UrlUseTitle,
 		"page":          page,
 	})
 }

ui/template/header.html

@@ -10,7 +10,7 @@
     <link rel="canonical" href="{{.siteinfo.Canonical}}" />
     <link rel="manifest" href="/manifest.json"/>
     <link href="{{.cssPath}}" rel="stylesheet" />
-    <script defer="defer" src="{{.scriptPath}}"></script>
+    <!-- <script defer="defer" src="{{.scriptPath}}"></script> -->
     {{if $.siteinfo.JsonLD }}{{ .siteinfo.JsonLD | templateHTML}}{{end}}
 </head>
 

ui/template/question.html

@@ -4,49 +4,74 @@
     <div class="col-xxl-7 col-lg-8 col-sm-12">
       <div>
         <div class="mb-3 d-flex flex-wrap justify-content-between">
-          <h5 class="fs-5 text-nowrap mb-3 mb-md-0">{{translator $.language "ui.question.all_questions"}}</h5>
+          <h5 class="fs-5 text-nowrap mb-3 mb-md-0">
+            {{translator $.language "ui.question.all_questions"}}
+          </h5>
         </div>
         <div class="border-top border-bottom-0 list-group list-group-flush">
           {{range .data}}
           <div class="border-bottom pt-3 pb-2 px-0 list-group-item">
             <h5 class="text-wrap text-break">
+              {{if $.useTitle }}
+              <a class="link-dark" href="/questions/{{.ID}}/{{urlTitle .Title}}"
+                >{{.Title}}</a
+              >
+              {{else}}
               <a class="link-dark" href="/questions/{{.ID}}">{{.Title}}</a>
+              {{end}}
             </h5>
             <div
-              class="d-flex flex-column flex-md-row align-items-md-center fs-14 text-secondary">
+              class="d-flex flex-column flex-md-row align-items-md-center fs-14 text-secondary"
+            >
               <div class="d-flex">
                 <div class="text-secondary me-1">
-                  <a href="/users/{{.UserInfo.Username}}"><span
-                    class="me-1 text-break">{{.UserInfo.DisplayName}}</span></a><span
-                  class="fw-bold" title="Reputation">{{.UserInfo.Rank}}</span>
+                  <a href="/users/{{.UserInfo.Username}}"
+                    ><span class="me-1 text-break"
+                      >{{.UserInfo.DisplayName}}</span
+                    ></a
+                  ><span class="fw-bold" title="Reputation"
+                    >{{.UserInfo.Rank}}</span
+                  >
                 </div>
-                •
-                {{if eq .CreateTime .UpdateTime}}
-                <time class="text-secondary ms-1"
-                      datetime="{{timeFormatISO $.timezone .CreateTime}}"
-                      title="{{translatorTimeFormatLongDate $.language $.timezone .CreateTime}}">{{translator $.language "ui.question.asked"}} {{translatorTimeFormat $.language $.timezone .CreateTime}}
+                • {{if eq .CreateTime .UpdateTime}}
+                <time
+                  class="text-secondary ms-1"
+                  datetime="{{timeFormatISO $.timezone .CreateTime}}"
+                  title="{{translatorTimeFormatLongDate $.language $.timezone .CreateTime}}"
+                  >{{translator $.language "ui.question.asked"}}
+                  {{translatorTimeFormat $.language $.timezone .CreateTime}}
                 </time>
                 {{else if gt .UpdateTime 0}}
-                <time class="text-secondary ms-1"
-                      datetime="{{timeFormatISO $.timezone .UpdateTime}}"
-                      title="{{translatorTimeFormatLongDate $.language $.timezone .UpdateTime}}">{{translator $.language "ui.question.modified"}} {{translatorTimeFormat $.language $.timezone .UpdateTime}}
+                <time
+                  class="text-secondary ms-1"
+                  datetime="{{timeFormatISO $.timezone .UpdateTime}}"
+                  title="{{translatorTimeFormatLongDate $.language $.timezone .UpdateTime}}"
+                  >{{translator $.language "ui.question.modified"}}
+                  {{translatorTimeFormat $.language $.timezone .UpdateTime}}
                 </time>
                 {{end}}
               </div>
               <div class="ms-0 ms-md-3 mt-2 mt-md-0">
-                <span><i class="br bi-hand-thumbs-up-fill"></i><em
-                  class="fst-normal ms-1">{{.VoteCount}}</em></span>
-                <span class="ms-3"><i
-                  class="br bi-chat-square-text-fill"></i><em
-                  class="fst-normal ms-1">{{.AnswerCount}}</em></span>
-                <span class="summary-stat ms-3"><i
-                  class="br bi-eye-fill"></i><em class="fst-normal ms-1">{{.ViewCount}}</em></span>
+                <span
+                  ><i class="br bi-hand-thumbs-up-fill"></i
+                  ><em class="fst-normal ms-1">{{.VoteCount}}</em></span
+                >
+                <span class="ms-3"
+                  ><i class="br bi-chat-square-text-fill"></i
+                  ><em class="fst-normal ms-1">{{.AnswerCount}}</em></span
+                >
+                <span class="summary-stat ms-3"
+                  ><i class="br bi-eye-fill"></i
+                  ><em class="fst-normal ms-1">{{.ViewCount}}</em></span
+                >
               </div>
             </div>
             <div class="question-tags mx-n1 mt-2">
               {{range .Tags }}
-              <a href="/tags/{{.SlugName}}"
-                 class="badge-tag rounded-1 {{if .Reserved}}badge-tag-reserved{{end}} {{if .Recommend}}badge-tag-required{{end}} m-1">
+              <a
+                href="/tags/{{.SlugName}}"
+                class="badge-tag rounded-1 {{if .Reserved}}badge-tag-reserved{{end}} {{if .Recommend}}badge-tag-required{{end}} m-1"
+              >
                 <span class="">{{.SlugName}}</span>
               </a>
               {{end}}
@@ -59,9 +84,7 @@
         </div>
       </div>
     </div>
-    <div class="mt-5 mt-lg-0 col-xxl-3 col-lg-4 col-sm-12">
-
-    </div>
+    <div class="mt-5 mt-lg-0 col-xxl-3 col-lg-4 col-sm-12"></div>
   </div>
 </div>
 {{template "footer" .}}

ui/template/tag-detail.html

@@ -4,52 +4,74 @@
     <div class="col-xxl-7 col-lg-8 col-sm-12">
       <div class="tag-box mb-5">
         <h3 class="mb-3">
-          <a class="link-dark" href="/tags/{{$.tag.SlugName}}">{{$.tag.SlugName}}</a>
+          <a class="link-dark" href="/tags/{{$.tag.SlugName}}"
+            >{{$.tag.SlugName}}</a
+          >
         </h3>
-        <p class="text-break">
-          {{templateHTML $.tag.ParsedText}}
-        </p>
+        <p class="text-break">{{templateHTML $.tag.ParsedText}}</p>
       </div>
       <div>
         <div class="mb-3 d-flex flex-wrap justify-content-between">
           <h5 class="fs-5 text-nowrap mb-3 mb-md-0">
-            {{translator ($.language) "ui.question.x_questions" "count" .questionCount}}
+            {{translator ($.language) "ui.question.x_questions" "count"
+            .questionCount}}
           </h5>
         </div>
         <div class="border-top border-bottom-0 list-group list-group-flush">
           {{range .questionList}}
           <div class="border-bottom pt-3 pb-2 px-0 list-group-item">
             <h5 class="text-wrap text-break">
+              {{if $.useTitle }}
+              <a class="link-dark" href="/questions/{{.ID}}/{{urlTitle .Title}}"
+                >{{.Title}}</a
+              >
+              {{else}}
               <a class="link-dark" href="/questions/{{.ID}}">{{.Title}}</a>
+              {{end}}
             </h5>
             <div
-              class="d-flex flex-column flex-md-row align-items-md-center fs-14 text-secondary">
+              class="d-flex flex-column flex-md-row align-items-md-center fs-14 text-secondary"
+            >
               <div class="d-flex">
                 <div class="text-secondary me-1">
-                  <a href="/users/{{.UserInfo.Username}}"><span
-                    class="me-1 text-break">{{.UserInfo.DisplayName}}</span></a><span
-                  class="fw-bold" title="Reputation">{{.UserInfo.Rank}}</span>
+                  <a href="/users/{{.UserInfo.Username}}"
+                    ><span class="me-1 text-break"
+                      >{{.UserInfo.DisplayName}}</span
+                    ></a
+                  ><span class="fw-bold" title="Reputation"
+                    >{{.UserInfo.Rank}}</span
+                  >
                 </div>
                 •
-                <time class="text-secondary ms-1"
-                      datetime="{{timeFormatISO $.timezone .CreateTime}}"
-                      title="{{translatorTimeFormatLongDate $.language $.timezone .CreateTime}}">{{translator $.language "ui.question.asked"}} {{translatorTimeFormat $.language $.timezone .CreateTime}}
+                <time
+                  class="text-secondary ms-1"
+                  datetime="{{timeFormatISO $.timezone .CreateTime}}"
+                  title="{{translatorTimeFormatLongDate $.language $.timezone .CreateTime}}"
+                  >{{translator $.language "ui.question.asked"}}
+                  {{translatorTimeFormat $.language $.timezone .CreateTime}}
                 </time>
               </div>
               <div class="ms-0 ms-md-3 mt-2 mt-md-0">
-                <span><i class="br bi-hand-thumbs-up-fill"></i><em
-                  class="fst-normal ms-1">{{.VoteCount}}</em></span>
-                <span class="ms-3"><i
-                  class="br bi-chat-square-text-fill"></i><em
-                  class="fst-normal ms-1">{{.AnswerCount}}</em></span>
-                <span class="summary-stat ms-3"><i
-                  class="br bi-eye-fill"></i><em class="fst-normal ms-1">{{.ViewCount}}</em></span>
+                <span
+                  ><i class="br bi-hand-thumbs-up-fill"></i
+                  ><em class="fst-normal ms-1">{{.VoteCount}}</em></span
+                >
+                <span class="ms-3"
+                  ><i class="br bi-chat-square-text-fill"></i
+                  ><em class="fst-normal ms-1">{{.AnswerCount}}</em></span
+                >
+                <span class="summary-stat ms-3"
+                  ><i class="br bi-eye-fill"></i
+                  ><em class="fst-normal ms-1">{{.ViewCount}}</em></span
+                >
               </div>
             </div>
             <div class="question-tags mx-n1 mt-2">
               {{range .Tags }}
-              <a href="/tags/{{.SlugName}}"
-                 class="badge-tag rounded-1 {{if .Reserved}}badge-tag-reserved{{end}} {{if .Recommend}}badge-tag-required{{end}} m-1">
+              <a
+                href="/tags/{{.SlugName}}"
+                class="badge-tag rounded-1 {{if .Reserved}}badge-tag-reserved{{end}} {{if .Recommend}}badge-tag-required{{end}} m-1"
+              >
                 <span class="">{{.SlugName}}</span>
               </a>
               {{end}}
@@ -60,9 +82,7 @@
         <div class="mt-4 mb-2 d-flex justify-content-center"></div>
       </div>
     </div>
-    <div class="d-flex justify-content-center">
-      {{template "page" .}}
-    </div>
+    <div class="d-flex justify-content-center">{{template "page" .}}</div>
   </div>
 </div>
 {{template "footer" .}}