loading...
Cover image for Cross post to dev.to from Webflow or Google Docs - How to handle formatting?

Cross post to dev.to from Webflow or Google Docs - How to handle formatting?

richstone profile image Rich Stone ・2 min read

Hey folks!

I really would like to share my work with the dev.to community because I think I can solve a problem someone has here or there ;)

However, after quite some research, I'm kind of stuck with how to painlessly cross post my articles to dev.to.

I host my developer blog on webflow and write my stuff in Google Docs.

Don't get me wrong, I love markdown, but that's not my flow as of now.

Things I've tried and/or thought of:

RSS importer

The RSS importer does not work properly (just article snippets and formatting wrong).

Copy Pasta

From the Gdocs and the webflow editors I can flawlessly copy-paste to Medium(🍡). But on dev.to the RTF stuff is kindly ignored, which leaves me with an unbearable task of editing the format, the links, the pictures...

Post a short summary of the post with the link

πŸ˜’

Highly Automated Pipeline

  1. Write everything in markdown in VSCode checked by the VSCode Grammarly plugin.
  2. Push to GitHub
  3. GitHub action picks it up and sends it to Webflow/dev.to API (I wouldn't be able to post to Medium then without problems, but I can actually live without Medium TBH)

However, there are many wonderous questions:

  • How well will the platforms handle the markdown body?
  • How to handle the pain of having to pre-upload all pictures?
  • How do I handle updating the posts? (different GitHub actions with different requests?)
  • etc etc

Scraping

I mean, the HTML is up there: fullstack.coach...

Maybe then...

  1. Scrape it
  2. Push it through a markdown parser
  3. Send it to dev.to

(but again all the questions from the previous section... and probably even more...)


Before I throw myself into highly automated pipelines or scraping, which both sound like fun and time consumption:

Am I overthinking or is there maybe a better path that I am missing?

Posted on Jun 29 by:

richstone profile

Rich Stone

@richstone

Building products, learning and teaching over at fullstack.coach.

Discussion

markdown guide
 
  1. You can write the full article with markdown (that's what I do)

  2. You can use cloudinary for uploading the photos

  3. You can update the post with DEV API.

Take a look at the API, it might fix all your issues. 😊

Finally, welcome to the DEV community.

 

Thanks!

It's not solving my issue on how to connect it in a pleasant way to webflow (and maybe even cross post to medium additionally) but it's nice to know that posting/updating with dev.to is nothing to worry about.. ☺️

 

The main text editor of medium doesn't allow markdown. However, just like DEV, you can use Medium's API endpoints to post a blog.
Point to be noted: You can't edit posts with medium API

thanks man, this is very valuable information!

 

and also, what would I do with my already created posts?

it's about 15 thousand unmarkdowned words lost in RTF πŸ˜…

 

DEV allows crossposting. Just copy the canonical URL of your already created posts.

yeah, that's not my issue, but they are formatted as rich text format (tons of links, headings, bolds/italics, images, quotes etc. etc...)

converting them manually is like rather something that I dream of after a challenging day πŸ˜…

Can I get the link of your website where you post the blogs? That might be a little helpful.

Sure: fullstack.coach

I mention it in the post, too ;)

It’s hosted with webflow.com

Here is an example post:

fullstack.coach/post/what-is-a-ful...

Anyway, thank you so much for your thoughts and attention πŸ™

Anyway, thank you so much for your thoughts and attention πŸ™

You will always have your back covered here at DEV.

I mention it in the post, too ;)

I am too lazy to read the full post(sorry) πŸ˜‹

FINALLY

I turned your this post into this Dev post(don't worry, this is just an example. I haven't and will not publish the post). Let me know once you are done looking at the post and I will delete it.

Is this what you were looking for? (let me know. I will be happy to share the process)

Maaaan, this is amazing! Seems that there is literally everything in the right place.

I just started to build a node script, that will parse markdown to HTML. Then I can send the markdown via the API to dev.to and HTML to webflow (which is accepts with HTML, I found out). But I have to find the right parser first and there are many other cornerstones on the way too :)

Hence, I'm very curious about how you've achieved that result!

Here is a good news for you. DEV supports markdown and you can write raw HTML in markdown. That means you can even write HTML in DEV and it will work perfectly.

nice catch!!! This will be a great way to migrate my existing postsπŸš€πŸš€

I'll still build the automation pipeline for future articles since this will be not only very convenient but also the only way to have code highlighting optimized on all the platforms...

My fellow DEV, if you ever need anything, let me know ;)

interesting fact: if someone wants to cross post on codementor.io, they also support markdown, but they rather use a simple parser, which does not recognize raw HTML...

dev.to rocks! 🀟

My fellow DEV, if you ever need anything, let me know ;)

Looks like a good deal to me

I'll still build the automation pipeline for future articles ...

Seems pretty legit

dev.to rocks! 🀟

Without any single doubt

 

Crazy idea. Assuming you can live without Medium, what if instead of publishing to your site and then crossposting to DEV, you post first to DEV and then let your site import your content from DEV?

 

thanks for the idea! That's very nice outside-the-box thinking πŸš€πŸš€

I could even provide a canonical URL right away. (although the impact on SEO is a bit unclear because usually what you'll do is: posting your original content in your place and only after a few days cross-posting it so that search engines have enough time to figure out the original content)

However, webflow (my blog host) doesn't have the option to import HTML...