{"id":2778,"date":"2026-01-18T21:47:41","date_gmt":"2026-01-18T21:47:41","guid":{"rendered":"https:\/\/ditib-heidenheim.de\/?page_id=2778"},"modified":"2026-01-18T21:48:00","modified_gmt":"2026-01-18T21:48:00","slug":"freitagspredigt-cuma-hutbesi","status":"publish","type":"page","link":"https:\/\/ditib-heidenheim.de\/tr\/freitagspredigt-cuma-hutbesi\/","title":{"rendered":"Freitagspredigt (Cuma Hutbesi)"},"content":{"rendered":"\t\t
\n\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\n\n\n \n \n Cuma Hutbe Widget Final<\/title>\n <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/PapaParse\/5.3.0\/papaparse.min.js\"><\/script>\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Amiri:wght@400;700&display=swap\" rel=\"stylesheet\">\n\n <style>\n * { margin: 0; padding: 0; box-sizing: border-box; }\n \n body {\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n background: #f4f4f4; \n min-height: 100vh;\n padding: 20px;\n }\n \n .widget-card {\n max-width: 950px;\n margin: 0 auto;\n background: white;\n border-radius: 16px;\n box-shadow: 0 10px 30px rgba(0,0,0,0.1);\n overflow: hidden;\n display: flex;\n flex-direction: column;\n min-height: 500px;\n }\n\n \/* HEADER (ROT) *\/\n .widget-header {\n background: linear-gradient(135deg, #cb2d3e 0%, #ef473a 100%);\n color: white;\n padding: 25px 30px;\n position: relative;\n }\n\n .super-header {\n text-transform: uppercase;\n letter-spacing: 1.5px;\n font-size: 13px;\n font-weight: 600;\n color: rgba(255, 255, 255, 0.9);\n margin-bottom: 5px;\n }\n\n .main-title { font-size: 26px; font-weight: 700; margin: 0; line-height: 1.2; }\n\n .date-badge {\n background: rgba(255, 255, 255, 0.25);\n padding: 5px 15px;\n border-radius: 20px;\n font-size: 14px;\n display: inline-block;\n margin-top: 10px;\n backdrop-filter: blur(5px);\n }\n\n \/* BODY LAYOUT *\/\n .widget-body { display: flex; flex: 1; position: relative; }\n\n \/* SIDEBAR (LINKS) *\/\n .sidebar {\n width: 80px; background: #fcfcfc; border-right: 1px solid #eee;\n display: flex; flex-direction: column; align-items: center;\n padding: 25px 0; gap: 15px; flex-shrink: 0;\n }\n\n .flag-btn {\n width: 50px; height: 50px; border-radius: 50%; border: 2px solid #eee;\n background: white; box-shadow: 0 2px 5px rgba(0,0,0,0.05); cursor: pointer;\n font-size: 24px; display: flex; align-items: center; justify-content: center;\n transition: all 0.2s ease;\n }\n .flag-btn:hover { transform: scale(1.1); border-color: #ef473a; }\n .flag-btn.active { border-color: #ef473a; background: #fff0f0; transform: scale(1.15); box-shadow: 0 4px 10px rgba(239, 71, 58, 0.3); }\n\n \/* CONTENT AREA *\/\n .content-area { flex: 1; padding: 40px; background: #fff; }\n .content-item { display: none; animation: fadeIn 0.5s ease-in-out; }\n .content-item.active { display: block; }\n @keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }\n\n \/* --- TEXT STYLING --- *\/\n \n \/* 1. Haupt\u00fcberschrift im Text *\/\n .content-item h2 { \n color: #c0392b; \/* Dunkelrot *\/\n border-bottom: 2px solid #f2f2f2; \n padding-bottom: 15px; \n margin-bottom: 25px; \n font-size: 24px; \n }\n\n \/* 2. Normale Abs\u00e4tze (mit mehr Abstand) *\/\n .content-item p { \n margin-bottom: 20px; \n line-height: 1.8; \n color: #444; \n font-size: 17px; \n }\n\n \/* --- FARBLICHE BOXEN --- *\/\n\n \/* A. ARABISCHE VERSE (R\u00f6tlich) *\/\n .arabic-quote {\n background-color: #fff5f5; \/* Helles Rot *\/\n border-left: 5px solid #cb2d3e; \/* Roter Balken *\/\n padding: 20px 25px;\n margin: 30px 0;\n font-family: 'Amiri', 'Traditional Arabic', serif; \n font-size: 26px;\n line-height: 2.2;\n direction: rtl; \n text-align: right; \n color: #333;\n border-radius: 0 8px 8px 0;\n }\n\n \/* B. ANREDEN (Zwischen\u00fcberschriften) *\/\n .section-title { \n color: #b71c1c; \/* Kr\u00e4ftiges Rot *\/\n font-weight: 800; \n font-size: 1.2em; \n margin-top: 35px; \n margin-bottom: 15px; \n display: block;\n }\n\n \/* C. DUA \/ GEBET (Gr\u00fcn) *\/\n .dua-section {\n background-color: #e8f5e9; \/* Helles Gr\u00fcn *\/\n border: 1px solid #c8e6c9;\n border-left: 5px solid #2e7d32; \/* Dunkelgr\u00fcner Balken *\/\n padding: 25px;\n border-radius: 8px;\n margin-top: 40px;\n color: #1b5e20; \/* Dunkelgr\u00fcner Text *\/\n font-style: italic;\n }\n\n \/* D. ANK\u00dcNDIGUNGEN (DUYURULAR) *\/\n .announcement-box {\n background-color: #fffbfb;\n border: 2px solid #e53935;\n border-radius: 12px;\n padding: 0;\n margin-top: 50px;\n box-shadow: 0 5px 15px rgba(229, 57, 53, 0.15);\n overflow: hidden;\n }\n .announcement-header {\n background: #e53935;\n color: white;\n font-weight: 800;\n text-transform: uppercase;\n letter-spacing: 1px;\n padding: 12px 20px;\n display: flex;\n align-items: center;\n gap: 10px;\n }\n .announcement-header::before { content: \"\ud83d\udce2\"; font-size: 18px; }\n .announcement-box div, .announcement-box p { padding: 20px; margin: 0; }\n\n \/* Hilfsklassen *\/\n [dir=\"rtl\"] { direction: rtl; text-align: right; }\n [dir=\"rtl\"] .arabic-quote { border-left: none; border-right: 5px solid #cb2d3e; border-radius: 8px 0 0 8px; }\n \n \/* Handy Anpassung *\/\n @media (max-width: 600px) {\n .widget-body { flex-direction: column; }\n .sidebar { width: 100%; flex-direction: row; overflow-x: auto; padding: 10px; border-right: none; border-bottom: 1px solid #eee; }\n .content-area { padding: 25px; }\n }\n <\/style>\n<\/head>\n<body>\n\n <div class=\"widget-card\">\n <div class=\"widget-header\">\n <div class=\"super-header\" id=\"category-label\">CUMA HUTBES\u0130<\/div>\n <h1 class=\"main-title\" id=\"display-title\">Lade Predigt...<\/h1>\n <div class=\"date-badge\" id=\"display-date\">...<\/div>\n <\/div>\n\n <div class=\"widget-body\">\n <div class=\"sidebar\">\n <button class=\"flag-btn active\" onclick=\"changeLang('tr', this)\">\ud83c\uddf9\ud83c\uddf7<\/button>\n <button class=\"flag-btn\" onclick=\"changeLang('de', this)\">\ud83c\udde9\ud83c\uddea<\/button>\n <button class=\"flag-btn\" onclick=\"changeLang('ar', this)\">\ud83c\uddf8\ud83c\udde6<\/button>\n <button class=\"flag-btn\" onclick=\"changeLang('en', this)\">\ud83c\uddec\ud83c\udde7<\/button>\n <button class=\"flag-btn\" onclick=\"changeLang('bs', this)\">\ud83c\udde7\ud83c\udde6<\/button>\n <button class=\"flag-btn\" onclick=\"changeLang('sq', this)\">\ud83c\udde6\ud83c\uddf1<\/button>\n <button class=\"flag-btn\" onclick=\"changeLang('ur', this)\">\ud83c\uddf5\ud83c\uddf0<\/button>\n <button class=\"flag-btn\" onclick=\"changeLang('fr', this)\">\ud83c\uddeb\ud83c\uddf7<\/button>\n <\/div>\n \n <div class=\"content-area\" id=\"content-container\">\n <div style=\"text-align:center; color:#999; margin-top:40px;\">Daten werden geladen...<\/div>\n <\/div>\n <\/div>\n <\/div>\n\n <script>\n \/\/ -----------------------------------------------------------\n const sheetURL = \"https:\/\/docs.google.com\/spreadsheets\/d\/e\/2PACX-1vTNr_drGR0FQ9DKZVCjw47xuj3zu2Kx_4KWIruj9u1nUtkihAeIfMsWi8_p1B2ETdzcaiFXyotoU-aE\/pub?output=csv\"; \n \/\/ -----------------------------------------------------------\n\n const labelTranslations = {\n 'tr': 'CUMA HUTBES\u0130', 'de': 'FREITAGSPREDIGT', 'ar': '\u062e\u0637\u0628\u0629 \u0627\u0644\u062c\u0645\u0639\u0629',\n 'en': 'FRIDAY SERMON', 'bs': 'D\u017dUMA HUTBA', 'sq': 'HUTBJA E XHUMAS\u00cb',\n 'ur': '\u062c\u0645\u0639\u06c1 \u06a9\u0627 \u062e\u0637\u0628\u06c1', 'fr': 'SERMON DU VENDREDI'\n };\n\n Papa.parse(sheetURL, {\n download: true, header: false,\n complete: function(results) { processData(results.data); },\n error: function() { document.getElementById('content-container').innerHTML = \"Fehler.\"; }\n });\n\n function processData(rows) {\n const container = document.getElementById('content-container');\n container.innerHTML = \"\";\n let dateFound = \"\";\n\n \/\/ Datum suchen (Zeile 1 \/ B1)\n if (rows[0] && rows[0][1]) dateFound = rows[0][1];\n \n if(dateFound) document.getElementById('display-date').innerText = dateFound;\n else document.getElementById('display-date').style.display = 'none';\n \n const validLangs = ['tr', 'de', 'ar', 'en', 'bs', 'sq', 'ur', 'fr'];\n \n rows.forEach(row => {\n if (row[1] && validLangs.includes(row[1].trim())) {\n const langCode = row[1].trim();\n const title = row[2] ? row[2] : \"\";\n const text = row[3] ? row[3] : \"\";\n const isRTL = (langCode === 'ur' || langCode === 'ar');\n const isActive = (langCode === 'tr') ? 'active' : '';\n\n if(text.length > 5) {\n const div = document.createElement('div');\n div.id = 'content-' + langCode;\n div.className = `content-item ${isActive}`;\n if(isRTL) div.setAttribute('dir', 'rtl');\n\n div.innerHTML = `<h2>${title}<\/h2><div>${text}<\/div>`;\n container.appendChild(div);\n\n if(langCode === 'tr') document.getElementById('display-title').innerText = title;\n }\n }\n });\n }\n\n function changeLang(lang, btn) {\n document.querySelectorAll('.content-item').forEach(el => el.classList.remove('active'));\n const target = document.getElementById('content-' + lang);\n \n if(target) {\n target.classList.add('active');\n const h2 = target.querySelector('h2');\n if(h2) document.getElementById('display-title').innerText = h2.innerText;\n if(labelTranslations[lang]) document.getElementById('category-label').innerText = labelTranslations[lang];\n }\n \n document.querySelectorAll('.flag-btn').forEach(el => el.classList.remove('active'));\n if(btn) btn.classList.add('active');\n }\n <\/script>\n<\/body>\n<\/html> \t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Cuma Hutbe Widget Final CUMA HUTBES\u0130 Lade Predigt… … \ud83c\uddf9\ud83c\uddf7 \ud83c\udde9\ud83c\uddea \ud83c\uddf8\ud83c\udde6 \ud83c\uddec\ud83c\udde7 \ud83c\udde7\ud83c\udde6 \ud83c\udde6\ud83c\uddf1 \ud83c\uddf5\ud83c\uddf0 \ud83c\uddeb\ud83c\uddf7 Daten werden geladen…<\/p>","protected":false},"author":11,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"page-builder","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-2778","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/ditib-heidenheim.de\/tr\/wp-json\/wp\/v2\/pages\/2778","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ditib-heidenheim.de\/tr\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/ditib-heidenheim.de\/tr\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/ditib-heidenheim.de\/tr\/wp-json\/wp\/v2\/users\/11"}],"replies":[{"embeddable":true,"href":"https:\/\/ditib-heidenheim.de\/tr\/wp-json\/wp\/v2\/comments?post=2778"}],"version-history":[{"count":4,"href":"https:\/\/ditib-heidenheim.de\/tr\/wp-json\/wp\/v2\/pages\/2778\/revisions"}],"predecessor-version":[{"id":2785,"href":"https:\/\/ditib-heidenheim.de\/tr\/wp-json\/wp\/v2\/pages\/2778\/revisions\/2785"}],"wp:attachment":[{"href":"https:\/\/ditib-heidenheim.de\/tr\/wp-json\/wp\/v2\/media?parent=2778"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}