Mar 18, 2021 03:22 AM
Hi, I want to pull the image (and the image’s URL) from a given website URL (always from opensea.io). On the website I found the <img class but don’t know how to automate this process.
Process example:
Mar 18, 2021 09:12 AM
Hi there!
If you’re manually browsing that website and you just want to save/create an new record in airtable for certain pieces of art you come across, you could automate the process using the web clipper app.
Granted, this does require you to manually navigate to each page you want to pull content from. If you’re talking about scraping a list of URLs for this information, that’s probably beyond the scope of what you can natively do with airtable alone.
Once you’ve got the extension set up (details at that link), you can create a corresponding app in your base and pull elements of the page using CSS selectors, which you can get by right-clicking on the elements in the inspector (what you highlighted) and selecting “copy selector.”
You can use the same selector element for the image (which goes into an attachment field) as well as the URL for the image you are trying to pull. For the image, you would pull in text content by CSS selector:
To get the URL, you would pull in the HTML attribute by CSS selector, using “src” as the HTML attribute to grab the URL:
(I also grabbed the price and the name of the piece using the CSS selector for those items. Less copying!) :winking_face:
Once you’ve set up the selectors and the fields they correspond to, clipping the content just means going to the page, opening the web clipper browser extension, and selecting your clip action, which should now prepopulate with the items indicated by the CSS selectors:
Select “add record” and it will be added to your base.
Mar 19, 2021 12:55 AM
Oh my, this is one of the most elaborate reply I’ve seen somebody gives in a community forum. Thank you so much you just solved all my questions. Super grateful :pray: :pray:
Mar 19, 2021 01:10 AM
One more follow-up question. I struggle doing this with .mp4 files? Would it be possible to also pull the mp4 file? I managed to get the URL with the HTML attribute but the video couldn’t be added as an attachement (.png works fine though):
mp4 example:
Video URL:
Mar 19, 2021 10:44 AM
Sure thing! :slightly_smiling_face:
It doesn’t seem like the web clipper interface supports video attachments. The attachment field in Airtable definitely does though. You could work around it with an automation that drops the video from the URL you clipped into the attachment field whenever you create a new record:
The video won’t show up in the attachment field when you clip it, but it will populate into your base when you add a record.
You could probably also do this via a batch update if you didn’t want to use automations, but that’s a bit more manual (say, a script you run periodically to pull in all the attachments).
Mar 20, 2021 03:11 AM
Thanks, love the idea with the automation. How exactly does the Record ID and Fields look like?
From Opensea, when clipping an mp4 file, it doesn’t clip the attachment but only the mp4 URL. How exactly do I need to set up the automation so it adds the video file to the Attachment Field from this mp4 URL?
See screenshot:
Mar 20, 2021 11:51 AM
The way you have it set up looks to be correct—the only thing I would check is in the record ID field in the “Update Record” step, you have indicated the record ID for the trigger. By default, the record ID is a hidden element of the record—not indicated in any field. It should be the first option in the properties list—“Record ID”— after you’ve tapped on the blue plus square and selected the trigger (the only option should be the record from step 1).
As far as I can tell, you have your attachment field set up correctly!
Also important to note—when you are on the page you are clipping from—when using the video clip action—you won’t see anything populating in the attachment field (you could actually remove it from the clip action if you wanted)—that step will be completed on the “backend” by the automation once the record is created.