Bookmarklet Code

Copy the code below and add it to your browser bookmark manager, or drag the 'RibbonIt!' Button to the Bookmarks bar. You can then click on this bookmarked button to add the page URL to Ribbonlinks. Bookmarklet works on any browser (desktop + mobile). It also does not slow down your browser.

javascript:(function(){if(document.getElementById('r')){document.getElementById('r').remove();return;}let d=document.createElement('div');d.id='r';d.style='position:fixed;inset:0;background:rgba(0,0,0,0.9);z-index:2147483647;font-family:system-ui,sans-serif;font-size:small;display:flex;align-items:center;justify-content:center;padding:12px;backdrop-filter:blur(8px);';let k=window.matchMedia('(prefers-color-scheme:dark)').matches;let b=k?'#1f2937':'#fff';let t=k?'#eee':'#111';let d2=k?'#555':'#ddd';let a='#a21caf';let p=document.title||'Untitled';let u=location.href;let h=`<div style="max-width:620px;width:100%;background:${b};color:${t};border:1px solid ${d2};border-radius:12px;overflow:hidden;">`;h+=`<div style="padding:12px 16px;background:${k?'#111':'#f8f9fa'};border-bottom:1px solid ${d2};display:flex;align-items:center;gap:10px;"><span style="background:${a};color:#fff;width:26px;height:26px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-weight:bold;">🎀</span><b>Ribbonlinks</b><span id="c" style="margin-left:auto;font-size:28px;cursor:pointer;color:${t};padding:0 8px;line-height:1;">×</span></div>`;let th='';let og=document.querySelector('meta[property="og:image"]');if(og&&og.content)th=og.content;else{let i=document.querySelector('img');if(i)th=i.src;}h+=`<div class="sv" data-t="${encodeURIComponent(p)}" data-u="${encodeURIComponent(u)}" data-i="${encodeURIComponent(th)}" style="cursor:pointer;padding:12px 16px;display:flex;gap:12px;border-bottom:1px solid ${d2};">`;if(th)h+=`<img src="${th}" style="width:96px;height:96px;object-fit:cover;border-radius:8px;border:1px solid ${d2};flex-shrink:0">`;h+=`<div style="flex:1;min-width:0;"><div style="font-weight:bold;line-height:1.4;">${p}</div><div style="word-break:break-all;opacity:0.85;margin-top:4px;">${u}</div><div style="margin-top:8px;color:${a};">Add this page to a Ribbon</div></div></div>`;h+=`<div style="padding:14px 16px;max-height:56vh;overflow:auto;"><b style="display:block;margin:8px 0 10px;color:${k?'#aaa':'#555'};">Images on page</b>`;let imgs=document.querySelectorAll('img');for(let i=0;i<imgs.length;i++){let img=imgs[i];if(img.src&&img.src.startsWith('http')&&img.offsetParent!==null){let src=img.src;h+=`<div class="sv" data-t="${encodeURIComponent(p)}" data-u="${encodeURIComponent(u)}" data-i="${encodeURIComponent(src)}" style="cursor:pointer;display:flex;gap:12px;margin-bottom:10px;padding:8px;border:1px solid ${d2};border-radius:8px;background:${b};">`;h+=`<img src="${src}" style="width:32px;height:32px;object-fit:cover;border-radius:8px;flex-shrink:0;" onerror="this.style.display='none'">`;h+=`<div style="flex:1;word-break:break-all;opacity:0.8;padding-right:8px;">${src.length>60?src.substring(0,60)+'...':src}</div>`;h+=`<button class="cp" data-url="${encodeURIComponent(src)}" style="background:${a};color:#fff;border:none;border-radius:6px;padding:1px 8px;font-size:12px;cursor:pointer;flex-shrink:0;">🔗</button></div>`;}}h+=`</div></div>`;d.innerHTML=h;document.body.appendChild(d);function s(el){let t=el.getAttribute('data-t');let u=el.getAttribute('data-u');let i=el.getAttribute('data-i');let url='https://ribbonlinks.com/dashboard.php?t='+t+'&u='+u;if(i)url+='&i='+i;window.open(url,'_blank','width=660,height=540');setTimeout(c,600);}function c(){let el=document.getElementById('r');if(el)el.remove();}function cp(b){let url=decodeURIComponent(b.getAttribute('data-url'));navigator.clipboard.writeText(url).then(()=>{b.textContent='Copied';setTimeout(()=>{b.textContent='🔗';},1500);});}document.getElementById('c').onclick=c;document.querySelectorAll('.sv').forEach(item=>item.onclick=function(){s(this);});document.querySelectorAll('.cp').forEach(btn=>btn.onclick=function(e){e.stopImmediatePropagation();cp(this);});})();

You can drag the button below titled 'RibbonIt!' to your bookmarks bar to add the bookmarklet code to your bookmarks bar.

RibbonIt!