A bookmarks block header to add context

A bookmarks block header to add context

Grouping bookmarks in blocks is the primary function of start.me. Over the past few years we have added many smaller and larger features to help customize bookmark blocks: adding descriptions, icon and detail view modes, selecting custom icons, transparent backgrounds, et cetera. Today’s addition is not a huge new feature, but it will surely open up a lot of new possibilities.

The need for context

When creating bookmark blocks a title will usually suffice to describe it. Sometimes – especially on public pages – you may find yourself looking for a way to provide more context. Putting Tech news above a block with links to TechCrunch, Engadget and Mashable will probably provide sufficient background information. But the title 10 Best movies may need a little more clarification. How did you decide which were best? And what genres did you pick from? Thrillers only? And best of what year?

We believe we have found a simple and elegant solution for that problem. From now on, you are able to add a description to the header of every bookmarks block. You can use this header to provide some clarification in the form of a subtitle, short description or even an entire blog post.

Bookmark block with the new header
A descriptive header helps add context to the links in a bookmark block

The new bookmarks block header opens up a multitude of new creative options, too. You could create a page for your students with various essay subjects for them to choose from. Each block could introduce a different subject and the bookmarks would direct the young essayists to the sources you want them to use.

Adding a header to your bookmarks block

The easiest way to add a header to your bookmarks block is by using the edit mode. Switch the widget to edit mode by double clicking its header or selecting Edit from the drop down menu. A text editor will show that allows you to type a description.

Animation showing inline editor for bookmarks block headers
With the inline editor, a header is quickly added to a bookmarks block

To directly get a preview while you are typing, there is a second method. This might be especially useful if you are using formatting. Don’t use the Edit mode, but rather open the Settings sidebar (from the widget menu). You can enter your description there. While you are typing, the widget will automatically update.

Advanced markup (Markdown) formatting

The bookmarks block header supports rudimentary formatting options, similar to those offered by our notes widget. Using Markdown, you can format text and make it bold or italic, create links and bullet lists and even insert images and tables. Some quick examples will quickly get you up to speed:

  • To italicize a bit of text, put it between asterisks. So *italic* will be display as italic.
  • Making fragments bold is done by putting the text between pairs of asterisks. So **bold** will become bold.
  • Bullet lists are simply made by starting lines with a dash (-). So:
    - Apples
    - Bananas
    - Cherries

    Will become

    • Apples
    • Bananas
    • Cherries
  • Links are inserted by putting the text between square brackets and the URL of the link directly following it between parenthesis. So [CNN](https://cnn.com) will show as CNN.
Bookmark widget with an elaborate header
With Markdown, the bookmarks block header can be formatted in various ways

To find out more interesting formatting options, you may want to check the excellent tutorial about Markdown by Github.

Michiel de Wit

Michiel de Wit

Michiel is CGO and co-founder of start.me. He is a software professional with a lot of experience in developing enterprise grade web applications. He is a certified Scrum Master and a great proponent of modern software development practices.


(It's free and will only take a minute)

Leave a Reply

%d bloggers like this:

Subscribe to our blog via email

If you want to stay up-to-date, enter your email address below. You will receive notifications of new posts by email.

Subscribe to our blog ➔