YouTube Wayback Archive & Video Tools

31 gwetrdagfswgff

संपादक में खोलें Video अपना कोड प्रकाशित करें

अनुशंसित

21 July 2025

YouTube एम्बेड और प्रभाव के साथ HTML टीवी स्क्रीन

2 September 2025

YouTube एम्बेड और ग्लिच प्रभाव के साथ HTML टीवी स्क्रीन

HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>YouTube Wayback & Video Helper</title>
    <style>
        :root {
            --primary: #ff0000;
            --secondary: #282828;
            --accent: #00a8ff;
            --bg: #f9f9f9;
            --text: #333;
        }

body {
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
            background-color: var(--bg);
            color: var(--text);
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            margin: 0;
        }

.container {
            background: white;
            padding: 2rem;
            border-radius: 12px;
            box-shadow: 0 10px 25px rgba(0,0,0,0.1);
            width: 100%;
            max-width: 500px;
            text-align: center;
        }

h1 {
            font-size: 1.5rem;
            margin-bottom: 1.5rem;
            color: var(--secondary);
        }

.input-group {
            margin-bottom: 1.5rem;
        }

input[type="text"] {
            width: 100%;
            padding: 12px;
            border: 2px solid #ddd;
            border-radius: 6px;
            box-sizing: border-box;
            font-size: 1rem;
            transition: border-color 0.3s;
        }

input[type="text"]:focus {
            border-color: var(--primary);
            outline: none;
        }

.button-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 10px;
        }

button {
            padding: 12px;
            border: none;
            border-radius: 6px;
            cursor: pointer;
            font-weight: bold;
            transition: opacity 0.2s;
            color: white;
        }

.btn-save { background-color: #007bff; }
        .btn-archive { background-color: #6c757d; }
        .btn-convert { background-color: #28a745; }
        .btn-timestamp { background-color: #ffc107; color: #333; }

button:hover {
            opacity: 0.9;
        }

.full-width {
            grid-column: span 2;
            margin-top: 10px;
        }

.footer {
            margin-top: 1.5rem;
            font-size: 0.8rem;
            color: #888;
        }
    </style>
</head>
<body>

<div class="container">
    <h1>YouTube Tools & Archive</h1>
    
    <div class="input-group">
        <input type="text" id="videoUrl" placeholder="Paste YouTube URL here...">
    </div>

<div class="button-grid">
        <button class="btn-save" onclick="action('save')">Save to Wayback</button>
        <button class="btn-archive" onclick="action('view')">View History</button>
        <button class="btn-timestamp" onclick="action('timestamp')">Add Time (0s)</button>
        <button class="btn-convert" onclick="action('convert')">Convert Video</button>
        <button class="btn-save full-width" style="background-color: var(--secondary);" onclick="clearInput()">Clear</button>
    </div>

<div class="footer">
        Enter a URL to archive metadata or redirect to conversion services.
    </div>
</div>

switch(type) {
            case 'save':
                // Wayback Machine Save API
                window.open(`https://web.archive.org/save/${url}`, '_blank');
                break;
            case 'view':
                // Wayback Machine Search
                window.open(`https://web.archive.org/web/*/${url}`, '_blank');
                break;
            case 'convert':
                // Redirects to a common conversion logic (adding 'pp' to youtube.com)
                let convUrl = url.replace('youtube.com', 'youtubepp.com').replace('youtu.be/', 'youtubepp.com/watch?v=');
                window.open(convUrl, '_blank');
                break;
            case 'timestamp':
                // Adds a basic t=0s parameter if not present
                if (!url.includes('t=')) {
                    const separator = url.includes('?') ? '&' : '?';
                    document.getElementById('videoUrl').value = url + separator + 't=0s';
                }
                break;
        }
    }

function clearInput() {
        document.getElementById('videoUrl').value = '';
    }
</script>

</body>
</html>

YouTube Wayback Archive & Video Tools

अनुशंसित

YouTube एम्बेड और प्रभाव के साथ HTML टीवी स्क्रीन

YouTube एम्बेड और ग्लिच प्रभाव के साथ HTML टीवी स्क्रीन

HTML

CSS

JS

अनुशंसित

YouTube एम्बेड और प्रभाव के साथ HTML टीवी स्क्रीन

YouTube एम्बेड और ग्लिच प्रभाव के साथ HTML टीवी स्क्रीन

HTMLCopy

CSSCopy

JSCopy

HTML

CSS

JS