Status log

A simple way to display a "current status" message with an emoji of your choice in your blog's footer.¹

Preview

🐻

Your current status.

How to use

Add the markup below to your footer (Dashboard → Settings → Header and footer directives), then add the styles to your theme. You can change the "Current status" label or remove it completely by editing the content value in the CSS.

Markup

<div class="statuslog">
<div class="statuslog-emoji">
🐻
</div>
<div class="statuslog-content">
Your current status.
</div>
</div>

Styles

/* Status log | robertbirming.com */
.statuslog {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.3em 1em;
  max-width: 34rem;
  margin-block: var(--space-block);
  margin-inline: auto;
  padding-block: 1rem;
  padding-inline: 1.1rem;
  color: var(--text);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
}

/* Optional label */
.statuslog::before {
  content: "Current status";
  display: block;
  grid-column: 1 / -1;
  margin-block-end: 0.35em;
  font-size: 0.72em;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted);
}

.statuslog-emoji {
  font-size: 2.7rem;
  line-height: 1;
  align-self: start;
}

.statuslog-content {
  font-size: var(--font-small);
  overflow-wrap: break-word;
}

.statuslog-content > :first-child { margin-block-start: 0; }
.statuslog-content > :last-child { margin-block-end: 0; }

footer .statuslog {
  text-align: start;
}

Shortcuts

If you're in the Apple ecosystem, these shortcuts make it a little easier to update your current status.

Please note that you need to change the link to your Bear username (click the three dots and edit the bottom link). I tried making it part of the initial setup, but gave up after a while.

StatusText – a simple way to jump straight to the status log.
StatusLink – share the webpage you're currently browsing.
StatusMusic – share the song and artist you're listening to in Apple Music.
StatusWeather – share your current location and weather conditions.

If you create some shortcuts of your own and want them listed here, please let me know.

Want more? Check out the Bear library.

Happy blogging, and happy logging.

This add-on is built for Bearming. Using a different theme? Add the Bearming tokens to make it work with your setup.↩