I would like to use DevonThink Web clipper to clip websites into Obsidian. The main reason is that a lot of sites that I am interested contain programming code and it does a very good job retaining the code.
The problem is in terms of how it creates the markdown for images.
Here is an example
![You can use ChatGPT for code generation questions to increase productivity.][11]
And here is an example what happened in the same site when I used the MarkDownload - Markdown Web Clipper
This image appears properly in Obsidian
I donât like how the mark and Web clipper handles program code so I would prefer not to use it.
Does anybody have any suggestions. Can I get Obsidian to recognize the markdown that is generated in Devonthink? Can I somehow have DT3 Web clipper work with what Obsidian expects?
You might want to have a Smart Rule that runs a script that (1) replaces each [xx] in the main body with the corresponding (URL), and then (2) delete the footnote-style links. Perform the Smart Rule On Clipping.
The main reason for this is that this is valid Multimarkdown syntax which is what Devonthink supports. Obsidian have their own âflavourâ of markdown based roughly on Common Mark with other additions. From their help:
Obsidian strives for maximum capability without breaking any existing formats. As a result, we use a combination of flavors of Markdown.
Iâm aware of existing solutions available elsewhere. As a coding exercise I wrote the following simple script to convert reference-style links to inline ones. Tested successfully on 2 news clippings.
on performSmartRule(theRecords)
tell application id "DNtp"
repeat with theRecord in theRecords
if (type of theRecord is markdown) then
set thisText to plain text of theRecord
set plain text of theRecord to my ReplaceLinks(thisText)
end if
end repeat
end tell
end performSmartRule
on run
tell application id "DNtp"
set theRecords to selected records of think window 1
repeat with theRecord in theRecords
if (type of theRecord is markdown) then
set thisText to plain text of theRecord
set plain text of theRecord to my ReplaceLinks(thisText)
end if
end repeat
end tell
end run
on ReplaceLinks(theText)
local pTID
set pTID to AppleScript's text item delimiters
set paragraphList to (paragraphs of theText)
set fnFlag to false
repeat with i from 1 to (length of paragraphList)
set tp to item i of paragraphList
if tp begins with "[1]:" then
set fnFlag to true
set AppleScript's text item delimiters to linefeed
set mainText to (paragraphs 1 thru (i - 1) of theText) as text
end if
if (fnFlag is true) and (tp begins with "[") then
set AppleScript's text item delimiters to ": "
set theLabel to text item 1 of tp
set theURL to "(" & (text item 2 of tp) & ")"
set mainText to my ReplaceText(mainText, theLabel, theURL)
end if
end repeat
set AppleScript's text item delimiters to pTID
return mainText
end ReplaceLinks
on ReplaceText(theText, searchStr, replaceStr)
local prevTID
set prevTID to AppleScript's text item delimiters
set AppleScript's text item delimiters to searchStr
set theItemList to text items of theText
set AppleScript's text item delimiters to replaceStr
set theText to theItemList as string
set AppleScript's text item delimiters to prevTID
return theText
end ReplaceText
This relies on the reference numbers starting at [1].
I came up with this smart rule script (in JavaScript). Tried it only with your example, as I donât have others. It hoists the end-note images into the text and removes the end notes. I suggest you duplicate some of your MD files to a group, build a smart group from them, and add an execute script action to it with this script.
Do NOT run this script on your originals unless youâre sure that it does what you want!
If it works â good. If not, you can PM me, preferably with some sample MDs.
function performsmartrule(records) {
/* Regular expression to find end notes:
Number in square brackets, followed by a colon and at least a space. Followed by something in square brackets, supposedly the URL. The number and the URL are collected in capturing groups 1 and 2 */
const endNoteRE = /\[(\d+)\]:\s+\[(.*?)\].*?\)/g;
/* Loop over all markdown records */
records.filter(r => r.type() === 'markdown').forEach(r => {
/* Get the record's text in a local variable */
let txt = r.plainText();
/* Get all end notes in an array where each element is an array whose
- first element is the whole match ("[1]: [URL](URL)
- 2nd element is the 1st capturing group, i.e. the end note's number
- 3rd element is the 2nd capturing group, i.e. the URL
*/
const endNoteMatches = [...txt.matchAll(endNoteRE)];
/* Loop over all end notes */
endNoteMatches.forEach(match => {
const referenceNo = match[1];
/* Build a new regular expression to find the image in the text:
Exclamation mark followed by something in square brackets followed by the referenceNo in square brackets */
const replacementRE = new RegExp(`(!\\[.*?\\])\\[${referenceNo}\\]`, 'g');
/* replace the reference to the end note with the URL */
txt = txt.replaceAll(replacementRE, `$1(${match[2]})`);
/* Remove the end note */
txt = txt.replaceAll(match[0],"");
})
/* All images are fixed, update the record's text */
r.plainText = txt;
})
}
