Frames
Saar this page do not have virus, you are going to do the downloading of all files on this page into your computer.Frames (https://www.soyjak.st/frames.html) is a board that allows you to customize the layout of the Sharty. This can be helpful if you want to add/remove boards to the sidebar, while also allowing for non board related items such as quick access to the onion service or the 'ru. Only websites that allow for the iframe service can be accessible on the same page. YouTube, for example, will not work unless a video is embed but like stated before, the 'ru works. To still be able to access YouTube, for example, you will have to change the code to:
<a href="https://www.youtube.com" target="_blank">YouTube</a><br> \\This will cause YouTube or whatever the link is to open in a new tab
All of this is done by using the Tampermonkey extension. Make sure that you turn on Developer Mode in Extensions settings. You may have to turn on "Allow Access to File URL" which you can find in the details section of Tampermonkey within that same Extensions settings. Some basic HTML coding can is required (duh, you are redesigning the website) but I wonder what else you do to customize the site. There are plenty of things you can do.
Example[edit | edit source]
It may be easier to see here: https://files.catbox.moe/1cgeps.txt
// ==UserScript==
// @name Soyjak Frames Customizer
// @namespace http://tampermonkey.net/
// @version 1.1
// @description Clean frame setup for soyjak.st
// @author Nobody
// @match *://www.soyjak.st/frames.html
// @grant none
// ==/UserScript==
(function () {
'use strict';
// Create and inject frames loadFrames();
// Hide .boardlist in the main frame once it's loaded
document.getElementById('main').addEventListener('load', function () {
const boardlist = this.contentDocument.querySelector('.boardlist');
if (boardlist) boardlist.style.display = 'none';
});
function loadFrames() {
const sidebar = document.createElement('iframe');
sidebar.id = 'sidebar';
sidebar.name = 'sidebar';
sidebar.style.width = '180px'; // Adjust sidebar width here
sidebar.style.height = '100vh';
sidebar.style.border = 'none';
sidebar.style.float = 'left';
const main = document.createElement('iframe');
main.id = 'main';
main.name = 'main';
main.src = '/index.html';
main.style.width = 'calc(100% - 180px)';
main.style.height = '100vh';
main.style.border = 'none';
main.style.float = 'left';
document.body.innerHTML = ;
document.body.style.margin = '0';
document.body.appendChild(sidebar);
document.body.appendChild(main);
const sidebarContent = `
<html>
<head>
<style>
body {
margin: 0;
padding: 10px;
font-family: Arial, sans-serif;
background: #f0f8ff;
}
h1, h3 {
font-family: Arial, sans-serif;
color: #333;
margin-bottom: 10px;
}
h3 {
font-size: 14px;
background-color: lightblue;
padding: 5px;
border: 1px solid grey;
}
a {
font-size: 10pt;
color: blue;
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
</style>
</head>
<body>
<img src="" width="120px">
Quick Access
<a href="javascript:void(0);" onclick="window.parent.document.getElementById('main').src='/soy/index.html';">/soy/</a>
</body>
</html>
`;
const sidebarDoc = sidebar.contentDocument || sidebar.contentWindow.document;
sidebarDoc.open();
sidebarDoc.write(sidebarContent);
sidebarDoc.close();
}
})();
