mirror of
https://github.com/xtekky/gpt4free.git
synced 2026-02-03 06:13:38 -08:00
538 lines
No EOL
18 KiB
HTML
538 lines
No EOL
18 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en" data-color-mode="auto" data-light-theme="light" data-dark-theme="dark">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
<title>{{ title }}</title>
|
|
|
|
<meta name="description" content="GPT4Free documentation for GPT4Free Documentation Hub. Complete guides, examples, and API reference for free AI endpoints, code generation, and AI model integration." />
|
|
<meta name="keywords" content="GPT4Free, G4F, AI documentation, free AI API, OpenAI alternative, JavaScript AI client, Python AI library, AI integration, code generation, GPT4Free Documentation Hub" />
|
|
<meta name="author" content="GPT4Free Team" />
|
|
|
|
<!-- Open Graph -->
|
|
<meta property="og:type" content="article" />
|
|
<meta property="og:title" content="GPT4Free Documentation Hub" />
|
|
<meta property="og:description" content="GPT4Free documentation for GPT4Free Documentation Hub. Free AI endpoints, examples, and comprehensive guides." />
|
|
<meta property="og:url" content="https://g4f.dev/docs/" />
|
|
<meta property="og:site_name" content="GPT4Free Documentation" />
|
|
<meta property="og:image" content="https://g4f.dev/dist/img/apple-touch-icon.png" />
|
|
|
|
<!-- Twitter Card -->
|
|
<meta name="twitter:card" content="summary_large_image" />
|
|
<meta name="twitter:title" content="GPT4Free Documentation Hub | GPT4Free Documentation" />
|
|
<meta name="twitter:description" content="Free AI endpoints and comprehensive documentation for GPT4Free Documentation Hub." />
|
|
<meta name="twitter:image" content="https://g4f.dev/dist/img/apple-touch-icon.png" />
|
|
|
|
<!-- Canonical -->
|
|
<link rel="canonical" href="https://g4f.dev/docs/" />
|
|
|
|
<link rel="apple-touch-icon" sizes="180x180" href="/dist/img/apple-touch-icon.png" />
|
|
<link rel="icon" type="image/png" sizes="32x32" href="/dist/img/favicon-32x32.png" />
|
|
<link rel="icon" type="image/png" sizes="16x16" href="/dist/img/favicon-16x16.png" />
|
|
<link rel="manifest" href="/dist/img/site.webmanifest" />
|
|
|
|
<!-- GitHub Primer CSS & styles -->
|
|
<link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/light-74231a1f3bbb.css" />
|
|
<link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/dark-8a995f0bacd4.css" />
|
|
<link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/primer-primitives-225433424a87.css" />
|
|
<link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/primer-b8b91660c29d.css" />
|
|
<link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/global-205098e9fedd.css" />
|
|
<link crossorigin="anonymous" media="all" rel="stylesheet" href="https://github.githubassets.com/assets/code-177d21388df8.css" />
|
|
|
|
|
|
<style>
|
|
:root {
|
|
--accent: #8b3dff;
|
|
--background: #16101b;
|
|
--text-primary: #ddd;
|
|
--text-secondary: #9b7dff;
|
|
--card-bg: #1e152e;
|
|
--border-color: #333;
|
|
--hover-color: #a67eff;
|
|
}
|
|
|
|
body {
|
|
margin: 0;
|
|
padding: 0;
|
|
background: var(--background);
|
|
color: var(--text-primary);
|
|
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
|
|
line-height: 1.6;
|
|
min-height: 100vh;
|
|
}
|
|
|
|
.container {
|
|
display: flex;
|
|
max-width: 100%;
|
|
margin: 0;
|
|
padding: 2rem;
|
|
gap: 3rem;
|
|
min-height: calc(100vh - 4rem);
|
|
}
|
|
|
|
/* Enhanced main content styling */
|
|
main {
|
|
flex: 1;
|
|
background: var(--card-bg);
|
|
border-radius: 12px;
|
|
padding: 2.5rem;
|
|
box-shadow: 0 8px 30px rgba(0,0,0,0.7);
|
|
overflow-wrap: break-word;
|
|
position: relative;
|
|
}
|
|
|
|
/* Typography improvements */
|
|
.markdown-body h1 {
|
|
font-size: 2.8rem;
|
|
margin-bottom: 1rem;
|
|
font-weight: 700;
|
|
color: var(--text-primary);
|
|
border-bottom: 3px solid var(--accent);
|
|
padding-bottom: 0.5rem;
|
|
}
|
|
|
|
.markdown-body h2 {
|
|
margin-top: 3rem;
|
|
margin-bottom: 1rem;
|
|
border-bottom: 2px solid var(--accent);
|
|
padding-bottom: 0.25rem;
|
|
color: var(--text-primary);
|
|
}
|
|
|
|
.markdown-body h3 {
|
|
margin-top: 2rem;
|
|
margin-bottom: 0.8rem;
|
|
color: var(--text-primary);
|
|
}
|
|
|
|
.markdown-body p {
|
|
margin-bottom: 1.2rem;
|
|
color: var(--text-primary);
|
|
}
|
|
|
|
/* Enhanced link styling */
|
|
.markdown-body a {
|
|
color: var(--accent);
|
|
text-decoration: none;
|
|
transition: all 0.3s ease;
|
|
font-weight: 500;
|
|
}
|
|
|
|
.markdown-body a:hover,
|
|
.markdown-body a:focus {
|
|
color: var(--hover-color);
|
|
outline: none;
|
|
text-decoration: underline;
|
|
text-shadow: 0 0 8px rgba(139, 61, 255, 0.3);
|
|
}
|
|
|
|
/* Enhanced code block styling */
|
|
.markdown-body pre {
|
|
border-radius: 12px;
|
|
padding: 1.5rem !important;
|
|
font-size: 0.95rem !important;
|
|
overflow-x: auto;
|
|
max-height: 500px;
|
|
box-shadow: inset 0 0 12px rgba(0,0,0,0.6), 0 4px 20px rgba(0,0,0,0.4);
|
|
color: #fff;
|
|
border: 1px solid #3d2a5c;
|
|
position: relative;
|
|
}
|
|
|
|
|
|
.markdown-body code {
|
|
font-family: 'SF Mono', 'Cascadia Code', 'Roboto Mono', Consolas, Liberation Mono, Menlo, monospace;
|
|
background: rgba(139, 61, 255, 0.1);
|
|
padding: 0.2em 0.4em;
|
|
border-radius: 4px;
|
|
color: #e6ccff;
|
|
font-size: 0.9em;
|
|
}
|
|
|
|
.markdown-body pre code {
|
|
background: transparent;
|
|
padding: 0;
|
|
color: var(--fgColor-default, var(--color-fg-default))
|
|
}
|
|
/* Table styling */
|
|
.markdown-body table {
|
|
border-collapse: collapse;
|
|
width: 100%;
|
|
margin: 2rem 0;
|
|
border-radius: 8px;
|
|
overflow: hidden;
|
|
box-shadow: 0 4px 20px rgba(0,0,0,0.3);
|
|
}
|
|
|
|
.markdown-body table th,
|
|
.markdown-body table td {
|
|
padding: 1rem;
|
|
text-align: left;
|
|
border: 1px solid var(--border-color);
|
|
}
|
|
|
|
.markdown-body table th {
|
|
background: var(--accent);
|
|
color: white;
|
|
font-weight: 600;
|
|
}
|
|
|
|
.markdown-body table tr:nth-child(even) {
|
|
background: rgba(139, 61, 255, 0.05);
|
|
}
|
|
|
|
.markdown-body table tr {
|
|
background-color: transparent;
|
|
}
|
|
|
|
/* List styling */
|
|
.markdown-body ul,
|
|
.markdown-body ol {
|
|
margin-bottom: 1.5rem;
|
|
padding-left: 2rem;
|
|
}
|
|
|
|
.markdown-body li {
|
|
margin-bottom: 0.5rem;
|
|
color: var(--text-primary);
|
|
}
|
|
|
|
/* Blockquote styling */
|
|
.markdown-body blockquote {
|
|
border-left: 4px solid var(--accent);
|
|
background: rgba(139, 61, 255, 0.1);
|
|
margin: 2rem 0;
|
|
padding: 1rem 1.5rem;
|
|
border-radius: 0 8px 8px 0;
|
|
}
|
|
|
|
/* HR styling */
|
|
.markdown-body hr {
|
|
border: none;
|
|
border-top: 2px solid var(--accent);
|
|
margin: 3rem 0;
|
|
opacity: 0.6;
|
|
}
|
|
|
|
/* Sticky table of contents */
|
|
nav#toc {
|
|
flex: 0 0 280px;
|
|
position: sticky;
|
|
top: 2rem;
|
|
background: var(--card-bg);
|
|
padding: 1.5rem;
|
|
border-radius: 12px;
|
|
box-shadow: 0 8px 30px rgba(0,0,0,0.7);
|
|
max-height: calc(100vh - 4rem);
|
|
overflow-y: auto;
|
|
font-size: 0.9rem;
|
|
line-height: 1.5;
|
|
border: 1px solid rgba(139, 61, 255, 0.2);
|
|
}
|
|
|
|
nav#toc h2 {
|
|
font-size: 1.4rem;
|
|
margin: 0 0 1.5rem 0;
|
|
border-bottom: 2px solid var(--accent);
|
|
padding-bottom: 0.5rem;
|
|
color: var(--text-primary);
|
|
}
|
|
|
|
nav#toc ul {
|
|
list-style: none;
|
|
padding-left: 0;
|
|
margin: 0;
|
|
}
|
|
|
|
nav#toc li {
|
|
margin-bottom: 0.8rem;
|
|
}
|
|
|
|
nav#toc a {
|
|
color: var(--text-secondary);
|
|
text-decoration: none;
|
|
display: block;
|
|
padding: 0.3rem 0.5rem;
|
|
border-radius: 6px;
|
|
transition: all 0.3s ease;
|
|
}
|
|
|
|
nav#toc a:hover,
|
|
nav#toc a:focus {
|
|
background: rgba(139, 61, 255, 0.1);
|
|
color: var(--hover-color);
|
|
text-decoration: none;
|
|
transform: translateX(4px);
|
|
}
|
|
|
|
/* Responsive design */
|
|
@media (max-width: 1024px) {
|
|
.container {
|
|
flex-direction: column;
|
|
padding: 1rem;
|
|
gap: 2rem;
|
|
}
|
|
|
|
nav#toc {
|
|
position: relative;
|
|
max-height: none;
|
|
order: -1;
|
|
flex: none;
|
|
}
|
|
|
|
.markdown-body h1 {
|
|
font-size: 2.2rem;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
.container {
|
|
padding: 0.5rem;
|
|
}
|
|
|
|
main {
|
|
padding: 1.5rem;
|
|
}
|
|
|
|
.markdown-body h1 {
|
|
font-size: 1.8rem;
|
|
}
|
|
|
|
.markdown-body pre {
|
|
padding: 1rem !important;
|
|
font-size: 0.85rem !important;
|
|
}
|
|
}
|
|
|
|
/* Accessibility improvements */
|
|
@media (prefers-reduced-motion: reduce) {
|
|
* {
|
|
animation-duration: 0.01ms !important;
|
|
animation-iteration-count: 1 !important;
|
|
transition-duration: 0.01ms !important;
|
|
}
|
|
}
|
|
|
|
/* Focus indicators */
|
|
*:focus {
|
|
outline: 2px solid var(--accent);
|
|
outline-offset: 2px;
|
|
}
|
|
|
|
/* Print styles */
|
|
@media print {
|
|
.container {
|
|
display: block;
|
|
}
|
|
|
|
nav#toc {
|
|
display: none;
|
|
}
|
|
|
|
main {
|
|
box-shadow: none;
|
|
background: white;
|
|
color: black;
|
|
}
|
|
}
|
|
|
|
/* Loading animation for syntax highlighting */
|
|
.highlight-loading {
|
|
position: relative;
|
|
opacity: 0.7;
|
|
}
|
|
|
|
.highlight-loading::after {
|
|
content: 'Loading syntax highlighting...';
|
|
position: absolute;
|
|
top: 1rem;
|
|
right: 1rem;
|
|
font-size: 0.8rem;
|
|
color: rgba(255, 255, 255, 0.6);
|
|
}
|
|
|
|
/* Translate Button Style */
|
|
#translate-toggle {
|
|
display: block;
|
|
background: var(--accent);
|
|
color: #fff;
|
|
text-align: center;
|
|
padding: 0.5rem;
|
|
border-radius: 6px;
|
|
margin-bottom: 1rem;
|
|
cursor: pointer;
|
|
font-size: 0.9rem;
|
|
border: none;
|
|
}
|
|
#google_translate_element {
|
|
margin-bottom: 1rem;
|
|
}
|
|
</style>
|
|
|
|
<script type="application/ld+json">
|
|
{
|
|
"@context": "https://schema.org",
|
|
"@type": "TechArticle",
|
|
"headline": "GPT4Free Documentation Hub",
|
|
"description": "GPT4Free documentation for GPT4Free Documentation Hub. Complete guides, examples, and API reference for free AI endpoints.",
|
|
"author": {
|
|
"@type": "Organization",
|
|
"@id": "https://g4f.dev/#organization",
|
|
"name": "GPT4Free",
|
|
"url": "https://g4f.dev",
|
|
"logo": {
|
|
"@type": "ImageObject",
|
|
"url": "https://g4f.dev/dist/img/apple-touch-icon.png"
|
|
}
|
|
},
|
|
"publisher": {
|
|
"@type": "Organization",
|
|
"@id": "https://g4f.dev/#organization"
|
|
},
|
|
"mainEntityOfPage": {
|
|
"@type": "WebPage",
|
|
"@id": "https://g4f.dev/docs/"
|
|
},
|
|
"datePublished": "2024-01-01T00:00:00Z",
|
|
"dateModified": "2024-01-01T00:00:00Z",
|
|
"inLanguage": "en",
|
|
"isAccessibleForFree": true,
|
|
"keywords": "GPT4Free, AI documentation, free AI API, code generation",
|
|
"articleSection": "Documentation"
|
|
}
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<nav id="toc" aria-label="Table of contents" role="navigation">
|
|
<!-- Translation Button -->
|
|
<button id="translate-toggle">🌐 Translate Page</button>
|
|
<div id="google_translate_element" style="display:none;"></div>
|
|
|
|
<h2>Contents</h2>
|
|
<ul id="toc-list"></ul>
|
|
<hr style="margin: 1.5rem 0; opacity: 0.3;">
|
|
<ul>
|
|
<li><a href="/docs/" aria-label="Return to documentation home">📚 Documentation Hub</a></li>
|
|
<li><a href="/" aria-label="Return to main site">🏠 G4F Home</a></li>
|
|
</ul>
|
|
</nav>
|
|
|
|
<main role="main" class="markdown-body entry-content" itemprop="text" itemscope itemtype="https://schema.org/TechArticle">{{ article }}</main>
|
|
</div>
|
|
|
|
<script>
|
|
// Toggle Translation Widget
|
|
document.getElementById("translate-toggle").addEventListener("click", function() {
|
|
const el = document.getElementById("google_translate_element");
|
|
el.style.display = (el.style.display === "none") ? "block" : "none";
|
|
});
|
|
|
|
function googleTranslateElementInit() {
|
|
new google.translate.TranslateElement({
|
|
pageLanguage: 'en',
|
|
layout: google.translate.TranslateElement.InlineLayout.SIMPLE
|
|
}, 'google_translate_element');
|
|
}
|
|
</script>
|
|
<script src="https://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
|
|
|
|
<script>
|
|
// Enhanced syntax highlighting with error handling
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
try {
|
|
// Generate table of contents
|
|
generateTableOfContents();
|
|
} catch (error) {
|
|
console.error('Error generating table of contents:', error);
|
|
}
|
|
});
|
|
|
|
function generateTableOfContents() {
|
|
const headings = document.querySelectorAll('main h2, main h3');
|
|
const tocList = document.getElementById('toc-list');
|
|
|
|
if (!tocList || headings.length === 0) return;
|
|
|
|
tocList.innerHTML = '';
|
|
|
|
headings.forEach(function(heading, index) {
|
|
const id = heading.id || `heading-${index}`;
|
|
if (!heading.id) {
|
|
heading.id = id;
|
|
}
|
|
|
|
const li = document.createElement('li');
|
|
const a = document.createElement('a');
|
|
a.href = `#${id}`;
|
|
a.textContent = heading.textContent;
|
|
a.setAttribute('aria-label', `Jump to ${heading.textContent}`);
|
|
|
|
if (heading.tagName === 'H3') {
|
|
li.style.marginLeft = '1rem';
|
|
li.style.fontSize = '0.9em';
|
|
}
|
|
|
|
li.appendChild(a);
|
|
tocList.appendChild(li);
|
|
});
|
|
}
|
|
|
|
// Smooth scrolling for anchor links
|
|
document.addEventListener('click', function(e) {
|
|
if (e.target.tagName === 'A' && e.target.getAttribute('href').startsWith('#')) {
|
|
e.preventDefault();
|
|
const target = document.querySelector(e.target.getAttribute('href'));
|
|
if (target) {
|
|
target.scrollIntoView({
|
|
behavior: 'smooth',
|
|
block: 'start'
|
|
});
|
|
}
|
|
}
|
|
});
|
|
|
|
// Add copy button to code blocks
|
|
document.querySelectorAll('pre code, .highlight pre').forEach(function(block) {
|
|
const button = document.createElement('button');
|
|
button.textContent = 'Copy';
|
|
button.className = 'copy-button';
|
|
button.style.cssText = `
|
|
position: absolute;
|
|
top: 0.5rem;
|
|
right: 0.5rem;
|
|
background: rgba(139, 61, 255, 0.8);
|
|
color: white;
|
|
border: none;
|
|
padding: 0.25rem 0.5rem;
|
|
border-radius: 4px;
|
|
cursor: pointer;
|
|
font-size: 0.8rem;
|
|
opacity: 0;
|
|
transition: opacity 0.3s ease;
|
|
`;
|
|
|
|
const pre = block.parentElement;
|
|
pre.style.position = 'relative';
|
|
pre.appendChild(button);
|
|
|
|
pre.addEventListener('mouseenter', function() {
|
|
button.style.opacity = '1';
|
|
});
|
|
|
|
pre.addEventListener('mouseleave', function() {
|
|
button.style.opacity = '0';
|
|
});
|
|
|
|
button.addEventListener('click', function() {
|
|
navigator.clipboard.writeText(block.textContent).then(function() {
|
|
button.textContent = 'Copied!';
|
|
setTimeout(function() {
|
|
button.textContent = 'Copy';
|
|
}, 2000);
|
|
});
|
|
});
|
|
});
|
|
</script>
|
|
</body>
|
|
</html> |