10 Examples Of Personal Safari Extensions Created With AI

Hi, this is Gary with MacMost.com. Let's take a look at using the new feature in macOS Golden Gate that lets you create your own personalized Safari extension. 

So a really big new feature in macOS Golden Gate is in Safari. We've had Safari extensions for a long time and you could have, if you're a developer, created your own extensions and even used AI tools to make them. But now that's all built right into Safari and you don't need to do any coding to make your own personalized extensions that change what's on the webpage and allow you to do certain things in Safari. To do this you're going to need macOS Golden Gate installed on your Mac. If you're seeing this before it's out or before you've updated this is a preview of what you can do. If you have Golden Gate, well, you can give this all a try. 

Here's your typical webpage. Here in Wikipedia it makes it pretty obvious what are the links in the text. But sometimes webpages don't do quite that or maybe you have trouble making out the dark blue from the dark black. Let's go and create an extension that will change this.  

So to create an extension you're going to click here to the left side of the address bar where it brings up lots of different options having to do with the page. One of these is describe Extensions. That's what this feature is called. Then it gives you some examples here. You can go in and read about some of these examples in these categories to give you an idea of what is possible. Now here you can just describe what you want. So let's try this: Make all text links on the page underlined, bold, and upper case. So, click next there and the first thing it is going to do is it's going to check to see if it's a valid request and it's also going to see if there are any extensions in The App Store that are available that will to do this. So you can choose those. As long as you get the little Okay up here which is Create Extensions you can click the Create button, there, and it will generate it for you. You can see its progress here at the top left, Creating Extension, and this whole little bar up here just remains there while it is working. You can actually browse elsewhere while this is going on or just wait for it to finish. When it is done you can see it gives it a Name and an Icon and that allows you to View or Try. If you click View it gives us a description for the extension there. So let's use Try here and it is going to give us a button here in the Toolbar. Usually extensions do that. The button there allows you to activate it. So I'm going to click it and you can even see it gives a description there on the Button. I click it and it will ask for permissions. It will do that for the first time. I'm going to say, On Every Website. You can see what it does. It did exactly what it was supposed to do. You can see I get all the text like that. So we can now keep this by clicking Save. If we do it remains there and it's an actual extension installed in Safari. We can go to Safari Settings and we can go to Extensions here and see it in the list. Select it. We can Edit it and further refine what's there or we can Delete it to get rid of it. So let's do that and let's try Variation because that was a very simple execution of what we wanted. 

Let's have it give us a ton of different options. I'm going to click again and choose Describe Extensions. This time I'm going to give a lot more detail of what I want. So here I'm asking it to give me checkboxes instead of just having one state where it highlights these. I want there to be checkboxes for Underline, Bold, Uppercase, and making it Red. You can imagine I can go further with this. I'm going to stick with those and ask it to generate this extension. There we go. Link Style it is called. We'll try it here. When I click it gives me these little text boxes and I can check it and it will actually make the change there and I can combine them to get what I want. I'm going to click Edit here and Delete. Let's go and create another one.

This time I'm going to ask it to get a list of Fonts used on this page and let me select replacements for each one from a Dropdown Menu. Okay. Font Replacer. Let's try it. So when I click here I get a list of all the Fonts. There it is. So I see each one and I can choose what I want to replace it with. So let's replace Times with Impact. We can see all of this must have been the Headline Font right there. How Serif. Let's replace that with, say, Georgia. Oh that was the Body Text. So that's really handy. 

Now let's go further. Instead of actually just creating something new for the next one let's Modify this one because I can see this works really well but it could use two improvements. First I really want to see at the very top the one that is most important. Here the bottom one is most important in the text. So can it actually sort them by usage. Also, I really want to be able to change it back to what it originally set to. If it is one of these I don't remember which one it is. So I would love to have a choice here to go back to the original. So, let's go and try that. I'm going to click Edit here and I'm going to Refine this right here. So, Allow One of the Choices in Each List to be Original so I can change it back. Also, sort with the Font that is used the most at the top. So, I'll Update. Here we go. I have the new version right here. Since we tried before the new version simply replaces the old one. I can click here and yes, sure enough, it is ordering them correctly. So I can change the font. I barely changed it there so let's do this one, there we go. But I also now can go back to the original. 

If you find these videos valuable consider joining the more than 3000 others that support MacMost through Patreon. You get exclusive content, course discounts, and more. You can read about it at macmost.com/patreon. 

This brings to mind another idea. I want to be able to track as I'm reading so I can basically know what paragraphs I've already read. It will be nice to click on a paragraph and it goes away and I can continue to eliminate paragraphs until I'm done reading. It could be interesting. So here's my prompt. When I click on a paragraph of text the text should disappear and if I click on that invisible paragraph it should return. So let's see if it can create this. A pretty straight forward request here. So I've got Toggle Paragraph Visibility. In this case I wouldn't expect anything to happen when I click here. But remember it's supposed to work on these paragraphs. When I click here sure enough it goes away and I can keep reading and keep reading until I'm finished. Then I can actually hover over some text that's there and yeah I can bring it back. So kind of a neat little thing there. Maybe I can have it change it to just a light gray. That might be better. The next thing would be to have it disappear entirely. Or maybe semi-transparent.

Often I want to see what images are on a webpage and you can look in Inspector for that but the order is just the order that they appear. Not a lot of the graphics or the tiny little things. It would be nice to just get a list of all the images but sorted with the largest one first. So here's my prompt. Show a list of all the images on the current page, sorted by size area with the largest first. So area I specify because I want it to be the images the look the biggest. Not are the largest files in terms of file size. So let's give that a go and see what I get. I'm intentionally not giving it much direction here in terms of the interface. I just want to see what it comes up with. Here we go. Image Size Sorter. Let's see what we get. Oh, interesting! It creates this little list here a little interface I can scroll through. I can tell these at the bottom, they're tiny, right. These at the top here, they are the real thing. It even gives me the size so I can see how much space it's using. I wonder if I can, oh look at that. I can drag. So I can actually drag it out so I can save the file and I control click on it, look at that. Download image, Copy image. That's nice. A nice little interface built with a very short prompt. 

I'm often worried when I visit a page about how many elements that are on that page that are tracking me. Like what else is on the page that is not really obvious. Let's see if we can create an extension to tell us. So, the prompt I want to start with is, Give me a list of invisible items on this page that come from or link to another domain. Alright, let's see what we've got here. I look there and I get this little list here and oh! a lot of these are still Wikipedia.org but just subdomains for images and things like that. So that's kind of not what I need. Let's go and edit and see if we can change it to be more of what I want. So I'm going to say, Just make it the top level domain that needs to be different and just give me the domain, not the full list because that would be really hard to read. So let's Update this. Alright, now let's see what we've got. Oh, a much shorter list here. You can see Wikidata, Wikimedia, of course. But this isn't the kind of page I'm worried about. Let's go and open up another tab and go somewhere else. 

So here's like a local news site of mine. I wonder what's going on here. I click this, oh checkout all this stuff out, right. A bunch of stuff. Facebook and there's some ad networks and all of that. Let's go somewhere that might be a little more fun. Word Cloud. Let's get a Word Cloud generated with the text that's in a webpage. So I'm going to describe the extension and I'm going to make it really simple. Just a Word Cloud with the words on the current page. Alright, here we go. Word Cloud generator and yeah, okay, here we go. It's not really a cloud. It starts with the most used words first and then continues from there. Let's refine it a bit. Let's see if we can describe a word cloud in very simple terms. Can you make it so the most used words are in the center and the rest spiral outwards. Let's update it with that. So with it updated let's give it a try. There we go, yeah, I kind of like how it did it. Very nice. I bet if I went further I could ask for colors as well. 

Now let's solve a real world problem. Look at all of the trackers in the URL. A quick copy and paste to this URL will keep all of that. I'd rather not have all of that. Be able to copy just the basics here. So let's go and try to create an extension that will give us just a quick way to copy a URL without the trackers. I'm going to try: Copy the URL of the current page to the Clipboard without any tracking codes. So we'll see if it can create this for us. Alright, so now we've got Clean Link Copier. Let's try it. Remember this is the Link here but if we click this does it work. I'll paste here to Paste Edit. Ummm. It actually when I examined it closely did get rid of the tracking stuff but there are still a lot of stuff there. So I think I need to get a little more specific. You can experiment with this a lot. But here's what I tried. The URL still has a lot of trackers. How about only keeping the first URL parameter if it is K= or S= , using K for keyword and S for Search. Otherwise remove all parameters. So being a little more strict here in this update. So let's try it now. I'll click that and let's paste this in and yeah, perfect, that worked. In fact if I were to paste that in as the URL here you could see it works perfectly fine without all those trackers. 

Now you can do more than just affect the content of the webpage. There's different ways in which you can give commands to Safari itself. Like for instance here I've got a bunch of tabs open. If I use Control Tab to go to the next tab it will do that and then move around. Some of these tabs are on the same website. These three are Wikipedia. These are other sites. So wouldn't it be interesting to have an extension that allows me to jump to the next tab that's the same website as the current one. So I'm going to say switch to the next tab that is from the same domain as this one. Let's try to see if it gets this right on the first go. Okay. So it's got Next Domain Tab. I'll try it. I like the choice of icon, a little arrow like that. If I click it, yep, it will jump to the third tab and the fifth tab and back to the first. Perfect. I've got a little useful thing there. 

Now over the years there has been a lot of different browser extensions, even whole browsers that have specialized that allow you to write notes for the webpage you're on. Then when you go back to that page you can see the note. Usually there are so many features. It goes way beyond leaving a simple note for yourself see in the future. Let's see if we can get an extension that does just that and nothing else. Here I'm going to say, Allow me to write a note about this page. Then the button in the Toolbar indicates whether there is a note and I can View and Edit. So I'm leaving a lot up to the AI here as to how it does this. So here we go. Pages Notes. Let's try it. I'm going to click here on this page and I'm going to write something and save the note. And then Save. Interesting it keeps this little window open here. If I click outside it will get rid of it. I do have an indicator now. That little red dot there. So what if I were to go to another page like this one here. The indicator is gone. If I go back, oh, the indicator appears there and I can click and there's the note. I'm going to Save this one here and leave it On. But in Safari Settings I'm going to select it. Note that I can add a Keyboard Shortcut for this. I'm going to do Option Command N there. Now I can bring it up with Option Command N. That's kind of handy. Go here. Bring it up. There's that note that I left. That was created with a really simple prompt. I could probably add a bunch of different fields. Give it some more functionality to it. I really create a Note taking extension for me to use, maybe not even in general, just for maybe a single project that I'm working on today. I bet you I can even have it export all the notes with the URL that the note is on in some sort of format. It is so easy to create these. Really there are so many possibilities here. 

Hope you found this useful. Thanks for watching.