Mindful Matter the new Holstee "Monthly Themed Content Magazine" is up and running. I'm expecting the design to grow and evolve with the more uses we come up with, and I built it in a way that it's super flexible to do that. Please share any thoughts with me that you have about the design, and fight for features you want.
I created an associative way of managing a string. What that means is it's one value that computes to two. I created special tag prefixes. When a tag has this special prefix and a colin after it the value after is set to that prefix variable. All the images are controlled by tags like image:http://website.com/image.png
that image becomes the banner image. There's also type tag if you put type:playlist
it will preface the title of the post with something like "Playlist: The essence of clarity". These associative tags are really easy to create so if anyone comes up with any others let me know (e.g. read time)
author:Mullica Zudsiri
author_link:https://twitter.com/mzudsiri
author_info:intern at holstee
image:http://www.123callingalldogs.com/savedimages/macexplorer_com-puppy-dog-26.jpg
type:playlist
main
(applied to the main post for the month)
Images automatically resize, so we can't promise that the a whole image will ever show as you intend. There's a great list of stock photography there (ironically on medium who's design we we're inspired by). So we shouldn't ever put text in these images because it will likely get cut off.
I suggest that you use Mou to write blog posts. It uses the markdown syntax, which is very easy to learn and very versatile. It has a nifty "copy html" feature. Then you just paste that in as the source of the post. The native Shopify admin editor doesn't support blockquote tags, it's pretty flawed in general, so I'd advise never using it directly. I created a "Mindful Matter Articles" folder in Dropbox within Modsquad. This also would allow us to have backup copies of every article.
Every post needs an excerpt, this just needs to be some kind of primer about the article. It can be edited here in the shopify admin.
The images that are chosen for the blog posts need to not have white space on top or else the nav disappears. The same thing goes for the title I think that generally darker / images without white need to be picked. If this is way to inconvenient an image could be darkened quickly in the Mac Preview app and uploaded to shopify and linked in the post. If this gets to the point where its way to inconvenient we can try to figure something out / some alternative.
The woman on the hey bail image has actual blocks white strips causing this space this is in the image and not an issue with the image heres the bad image and heres the good image.
The <blockquote>
html tag or >
in markdown is what is causing the text to be huge here. <blockquote>
tags should never be put next to each other.
A list or <li>
tag should be used to list out this recipe. In markdown it would look like this and render out to to a html list.
* 4 cups of vegetable stock (heated)
* 1 cup of arborio rice
* 1 small onion (finely chopped)
* 1 medium carrot (finely chopped)
* 1 stalk of celery (finely chopped)
* 2 cloves garlic (minced)
* 1 teaspoon oregano
* 2/3 cup fresh tomato sauce
* 2 tablespoons butter
* 2-4 tablespoons grated Parmesan (plus more for garnish)
* 2 cups cherry tomatoes (halved)
* olive oil
* salt and pepper to taste
The spacing is wonky here because the shopify editor sucks and can't tell when a new paragraph starts or ends, which is why I recommend Mou / markdown because it is smart and predictable, and it doesn't insert anything that shouldn't be in there.
Spotify has a little generator here in its docs where you can paste the "Shopify URI" in and it gives you the embed code.