How To SHARE X VIDEOS: I MADE A Special Tool

 I finally figured it out and have created a tool for you. All you have to do is insert the original link of the post into this tool and it will automatically make a copyable, shareable, link. Be sure to tech it out!! God bless and Tech Talk To You Later!!

/* Basic page styling (minimal, for the button) */

body {

font-family: Arial, sans-serif;

margin: 0;

padding: 20px;

background-color: #f0f0f0;

}

.content {

max-width: 1200px;

margin: 0 auto;

padding: 20px;

background-color: white;

}

/* Popup button */

#openPopup {

padding: 10px 20px;

background-color: #1DA1F2;

color: white;

border: none;

border-radius: 5px;

cursor: pointer;

}

#openPopup:hover {

background-color: #0d8ddb;

}

/* Popup (modal) styling */

.modal {

display: none; /* Hidden by default */

position: fixed;

top: 0;

left: 0;

width: 100%;

height: 100%;

background-color: rgba(0, 0, 0, 0.5); /* Semi-transparent overlay */

justify-content: center;

align-items: center;

z-index: 1000;

}

.modal-content {

background-color: #fff;

padding: 20px;

border-radius: 10px;

width: 90%;

max-width: 500px; /* Fixed width */

box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);

position: relative;

}

.close {

position: absolute;

top: 10px;

right: 15px;

font-size: 24px;

color: #657786;

cursor: pointer;

}

.close:hover {

color: #1DA1F2;

}

h2 {

color: #1DA1F2;

text-align: center;

margin-top: 0;

}

p {

text-align: center;

color: #657786;

margin-bottom: 20px;

}

input {

width: 100%;

padding: 10px;

margin-bottom: 15px;

border: 1px solid #ccd6dd;

border-radius: 5px;

box-sizing: border-box;

}

button.generate-btn {

width: 100%;

padding: 10px;

background-color: #1DA1F2;

color: white;

border: none;

border-radius: 25px;

cursor: pointer;

margin-bottom: 10px;

}

button.generate-btn:hover {

background-color: #0d8ddb;

}

#result {

margin-top: 15px;

padding: 10px;

background-color: #f5f8fa;

border-radius: 5px;

text-align: center;

color: #14171a;

}

#result a {

color: #1DA1F2;

text-decoration: none;

}

#result a:hover {

text-decoration: underline;

}

.button-group {

display: flex;

gap: 10px;

justify-content: center;

margin-top: 10px;

}

.copy-btn, .post-btn {

padding: 8px 20px;

border: none;

border-radius: 20px;

cursor: pointer;

font-size: 14px;

}

.copy-btn {

background-color: #657786;

color: white;

}

.copy-btn:hover {

background-color: #536471;

}

.post-btn {

background-color: #1DA1F2;

color: white;

}

.post-btn:hover {

background-color: #0d8ddb;

}

// Popup control

const modal = document.getElementById(‘popupModal’);

const openBtn = document.getElementById(‘openPopup’);

let generatedUrl = ”; // Store the generated URL

openBtn.onclick = function() {

modal.style.display = ‘flex’;

};

function closeModal() {

modal.style.display = ‘none’;

document.getElementById(‘videoUrl’).value = ”; // Clear input

document.getElementById(‘result’).innerHTML = ”; // Clear result

document.getElementById(‘actionButtons’).style.display = ‘none’; // Hide buttons

}

// URL editing logic

function editUrl() {

const urlInput = document.getElementById(‘videoUrl’).value;

const resultDiv = document.getElementById(‘result’);

const actionButtons = document.getElementById(‘actionButtons’);

if (!urlInput || (!urlInput.includes(‘twitter.com’) && !urlInput.includes(‘x.com’))) {

resultDiv.innerHTML = “Please enter a valid Twitter/X video URL.”;

actionButtons.style.display = ‘none’;

return;

}

const statusMatch = urlInput.match(/status/d+/);

if (!statusMatch) {

resultDiv.innerHTML = “Invalid URL format. Ensure it contains a status ID.”;

actionButtons.style.display = ‘none’;

return;

}

const baseUrl = urlInput.substring(0, urlInput.indexOf(‘status/’) + statusMatch[0].length);

generatedUrl = baseUrl + “/video/1”;

resultDiv.innerHTML = `Shareable URL: ${generatedUrl}`;

actionButtons.style.display = ‘flex’; // Show copy and post buttons

}

// Copy URL to clipboard

function copyUrl() {

if (generatedUrl) {

navigator.clipboard.writeText(generatedUrl).then(() => {

alert(‘URL copied to clipboard!’);

}).catch(err => {

alert(‘Failed to copy URL: ‘ + err);

});

}

}

// Open X post window with URL

function postToX() {

if (generatedUrl) {

const tweetText = encodeURIComponent(generatedUrl);

window.open(`https://twitter.com/intent/tweet?text=${tweetText}`, ‘_blank’, ‘width=600,height=400’);

}

}

// Close modal when clicking outside

window.onclick = function(event) {

if (event.target === modal) {

closeModal();

}

};