bskyweb: iterate on HTML card metadata (#609)
Probably still not perfect, but better. - don't user avatar image. use banner for profile and post img, or nothing - most twitter metadata fields were redundant; twitter will parse out opengraph ("og:"), so don't duplicate those - add regular HTML description (for google, etc) - include URI - actually include textzio/stable
parent
19d6ded631
commit
d624b7cf58
|
@ -185,7 +185,13 @@ func (srv *Server) WebPost(c echo.Context) error {
|
||||||
if err != nil {
|
if err != nil {
|
||||||
log.Warnf("failed to fetch post: %s\t%v", uri, err)
|
log.Warnf("failed to fetch post: %s\t%v", uri, err)
|
||||||
} else {
|
} else {
|
||||||
data["postView"] = tpv.Thread.FeedDefs_ThreadViewPost.Post
|
req := c.Request()
|
||||||
|
postView := tpv.Thread.FeedDefs_ThreadViewPost.Post
|
||||||
|
data["postView"] = postView
|
||||||
|
data["requestURI"] = fmt.Sprintf("https://%s%s", req.Host, req.URL.Path)
|
||||||
|
if postView.Embed != nil && postView.Embed.EmbedImages_View != nil {
|
||||||
|
data["imgThumbUrl"] = postView.Embed.EmbedImages_View.Images[0].Thumb
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -203,7 +209,9 @@ func (srv *Server) WebProfile(c echo.Context) error {
|
||||||
if err != nil {
|
if err != nil {
|
||||||
log.Warnf("failed to fetch handle: %s\t%v", handle, err)
|
log.Warnf("failed to fetch handle: %s\t%v", handle, err)
|
||||||
} else {
|
} else {
|
||||||
|
req := c.Request()
|
||||||
data["profileView"] = pv
|
data["profileView"] = pv
|
||||||
|
data["requestURI"] = fmt.Sprintf("https://%s%s", req.Host, req.URL.Path)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -3,14 +3,12 @@
|
||||||
{% block head_title %}Bluesky{% endblock %}
|
{% block head_title %}Bluesky{% endblock %}
|
||||||
|
|
||||||
{% block html_head_extra -%}
|
{% block html_head_extra -%}
|
||||||
|
<meta name="description" content="See what's next."/>
|
||||||
|
<meta property="og:type" content="website"/>
|
||||||
<meta property="og:title" content="Bluesky Social"/>
|
<meta property="og:title" content="Bluesky Social"/>
|
||||||
<meta property="og:description" content="See what's next."/>
|
<meta property="og:description" content="See what's next."/>
|
||||||
<meta property="og:type" content="article"/>
|
<meta property="og:image" content="/static/social-card-default.png"/>
|
||||||
<meta property="og:image" content="/static/default-social-card.png"/>
|
<meta name="twitter:card" content="summary"/>
|
||||||
<meta name="twitter:title" content="Bluesky Social"/>
|
|
||||||
<meta name="twitter:description" content="See what's next."/>
|
|
||||||
<meta name="twitter:image" content="/static/default-social-card.png"/>
|
|
||||||
<meta name="twitter:card" content="summary_large_image"/>
|
|
||||||
<meta name="twitter:site" content="@bluesky"/>
|
<meta name="twitter:site" content="@bluesky"/>
|
||||||
{%- endblock %}
|
{%- endblock %}
|
||||||
|
|
||||||
|
|
|
@ -1,23 +1,39 @@
|
||||||
{% extends "base.html" %}
|
{% extends "base.html" %}
|
||||||
|
|
||||||
{# TODO: link rel=canonical #}
|
{% block head_title %}
|
||||||
{# TODO: "same as" #}
|
{%- if postView -%}
|
||||||
|
@{{ postView.Author.Handle }} on Bluesky
|
||||||
|
{%- else -%}
|
||||||
|
Bluesky
|
||||||
|
{%- endif -%}
|
||||||
|
{% endblock %}
|
||||||
|
|
||||||
{% block html_head_extra -%}
|
{% block html_head_extra -%}
|
||||||
{%- if postView %}
|
{%- if postView -%}
|
||||||
<meta property="og:type" content="article"/>
|
<meta property="og:type" content="website">
|
||||||
<meta name="twitter:card" content="summary"/>
|
<meta property="og:site_name" content="Bluesky Social">
|
||||||
<meta property="og:title" content="{{ postView.Author.Handle }} - Bluesky"/>
|
{%- if requestURI %}
|
||||||
<meta name="twitter:title" content="{{ postView.Author.Handle }} - Bluesky"/>
|
<meta property="og:url" content="{{ requestURI }}">
|
||||||
{%- if postView.Author.Avatar %}
|
|
||||||
<meta property="og:image" content="{{ postView.Author.Avatar }}"/>
|
|
||||||
<meta name="twitter:image" content="{{ postView.Author.Avatar }}"/>
|
|
||||||
{% endif -%}
|
{% endif -%}
|
||||||
{%- if postView.Record.Text %}
|
{%- if postView.Author.DisplayName %}
|
||||||
<meta property="og:description" content="{{ postView.Record.Text }}"/>
|
<meta property="og:title" content="{{ postView.Author.DisplayName }} (@{{ postView.Author.Handle }})">
|
||||||
<meta name="twitter:description" content="{{ postView.Record.Text }}"/>
|
{% else %}
|
||||||
|
<meta property="og:title" content="@{{ postView.Author.Handle }}">
|
||||||
{% endif -%}
|
{% endif -%}
|
||||||
<meta name="twitter:label1" content="Author DID">
|
{%- if postView.Record.Val.Text %}
|
||||||
<meta name="twitter:value1" content="{{ postView.Author.Did }}">
|
<meta name="description" content="{{ postView.Record.Val.Text }}">
|
||||||
|
<meta property="og:description" content="{{ postView.Record.Val.Text }}">
|
||||||
|
{% endif -%}
|
||||||
|
{%- if imgThumbUrl %}
|
||||||
|
<meta property="og:image" content="{{ imgThumbUrl }}">
|
||||||
|
<meta name="twitter:card" content="summary_large_image">
|
||||||
|
{%- elif postView.Author.Avatar %}
|
||||||
|
{# Don't use avatar image in cards; usually looks bad #}
|
||||||
|
<meta name="twitter:card" content="summary">
|
||||||
|
{% endif %}
|
||||||
|
<meta name="twitter:label1" content="Posted At">
|
||||||
|
<meta name="twitter:value1" content="{{ postView.CreatedAt }}">
|
||||||
|
<meta name="twitter:site" content="@bluesky">
|
||||||
{% endif -%}
|
{% endif -%}
|
||||||
{%- endblock %}
|
{%- endblock %}
|
||||||
|
|
||||||
|
|
|
@ -1,24 +1,40 @@
|
||||||
{% extends "base.html" %}
|
{% extends "base.html" %}
|
||||||
|
|
||||||
{# TODO: "same as" indication with DID? #}
|
{% block head_title %}
|
||||||
{# TODO: could work in profileView.DisplayName here, conditionally? #}
|
{%- if profileView -%}
|
||||||
|
@{{ profileView.Handle }} on Bluesky
|
||||||
|
{%- else -%}
|
||||||
|
Bluesky
|
||||||
|
{%- endif -%}
|
||||||
|
{% endblock %}
|
||||||
|
|
||||||
{% block html_head_extra -%}
|
{% block html_head_extra -%}
|
||||||
{%- if profileView -%}
|
{%- if profileView -%}
|
||||||
<meta property="og:type" content="article"/>
|
<meta property="og:type" content="website">
|
||||||
<meta name="twitter:card" content="summary"/>
|
<meta property="og:site_name" content="Bluesky Social">
|
||||||
<meta property="og:title" content="{{ profileView.Handle }} - Bluesky"/>
|
{%- if requestURI %}
|
||||||
<meta name="twitter:title" content="{{ profileView.Handle}} - Bluesky"/>
|
<meta property="og:url" content="{{ requestURI }}">
|
||||||
|
{% endif -%}
|
||||||
|
{%- if profileView.DisplayName %}
|
||||||
|
<meta property="og:title" content="{{ profileView.DisplayName }} (@{{ profileView.Handle }})">
|
||||||
|
{% else %}
|
||||||
|
<meta property="og:title" content="{{ profileView.Handle }}">
|
||||||
|
{% endif -%}
|
||||||
{%- if profileView.Description %}
|
{%- if profileView.Description %}
|
||||||
<meta property="og:description" content="{{ profileView.Description }}"/>
|
<meta name="description" content="{{ profileView.Description }}">
|
||||||
<meta name="twitter:description" content="{{ profileView.Description }}"/>
|
<meta property="og:description" content="{{ profileView.Description }}">
|
||||||
{% endif -%}
|
{% endif -%}
|
||||||
{%- if profileView.Avatar %}
|
{%- if profileView.Banner %}
|
||||||
<meta property="og:image" content="{{ profileView.Avatar }}"/>
|
<meta property="og:image" content="{{ profileView.Banner }}">
|
||||||
<meta name="twitter:image" content="{{ profileView.Avatar }}"/>
|
<meta name="twitter:card" content="summary_large_image">
|
||||||
{% endif -%}
|
{%- elif profileView.Avatar -%}
|
||||||
<meta name="twitter:label1" content="Author DID">
|
{# Don't use avatar image in cards; usually looks bad #}
|
||||||
|
<meta name="twitter:card" content="summary">
|
||||||
|
{% endif %}
|
||||||
|
<meta name="twitter:label1" content="Account DID">
|
||||||
<meta name="twitter:value1" content="{{ profileView.Did }}">
|
<meta name="twitter:value1" content="{{ profileView.Did }}">
|
||||||
{%- endif -%}
|
<meta name="twitter:site" content="@bluesky">
|
||||||
|
{% endif -%}
|
||||||
{%- endblock %}
|
{%- endblock %}
|
||||||
|
|
||||||
{% block noscript_extra -%}
|
{% block noscript_extra -%}
|
||||||
|
|
Loading…
Reference in New Issue