Home → Questions →

Adding style elements to images

• Edit

graham wheeler

09 Mar, 2015 05:27 AM

I have inline images that I want to have styles applied (most importantly float attributes). In my markdown I'm using this type of syntax:

[{: style="float:right"}

However, marked doesn't recognize the style part. Is there a supported way to add CSS styling to images that will work?

1. Support Staff 1 Posted by Brett on 09 Mar, 2015 11:52 AM

   

   The syntax you're using is Kramdown. You can use Kramdown as a custom processor, or you can use MultiMarkdown reference syntax.

   ![][1]

   [1]: image.jpg "title" style="float:left"

   • Edit

2. 2 Posted by graham wheeler on 10 Mar, 2015 04:37 AM

   

   Thanks for the fast response, Brett. Actually this is Python markdown, as I'm writing for the Pelican static site generator.

   I tried adding it as a custom processor:

   Path: /usr/local/bin/python
   Args: -m markdown -x markdown.extensions.attr_list

   but it still doesn't work; I see the {:style="float:right"} as text in the result. However:

       cat <file> | python -m markdown -x markdown.extensions.attr_list

   works fine, so my command line seems right.

   • Edit

3. Support Staff 3 Posted by Brett on 10 Mar, 2015 01:44 PM

   

   Your custom processor works for me as you describe it.

   1. Are you certain it's running based on the green indicator at the
   bottom of the preview window?
   2. Which version of Marked are you using?

   -Brett

   • Edit

4. 4 Posted by graham wheeler on 10 Mar, 2015 02:00 PM

   

   The green indicator was on. I toggled it off, then on again, and I got a prompt about granting permissions. After clicking on allow it started working. :-)

   This is with 2.4.9.

   • Edit

5. Support Staff 5 Posted by Brett on 10 Mar, 2015 02:07 PM

   

   Glad to hear it. The sandboxing in the MAS version causes a lot of issues with custom processors, but the version in review should improve the situation. Also note there's a cheat in Advanced prefs titled Update Permissions that allows you to grant access to your entire drive.

   • Edit