Blog
Author: Osman Y.
Visited 768,
Followers 1,
Shared 0
Merhabalar Web Sitesi X5 programlarım var yeni sürüm websitex5 2023.3.7 yeni ürün satın aldım
kendi veb siteniz de blog sayfası https://www.websitex5.com/en/resources/blog/< /span> bu şekilde görünürken, benim yeni aldığım websitex5 Pro 2023.3.7 yeni sürümde ise eski sürümün blog görünümü var
sizin safanızın blog görünümüne nasıl geçiş yapabilirim
kendi websayfamon blog ekran görünümünü gönderiyorum
Posted on the
(de > tr)
Incomedia'nın WebSiteX5 alıcıları için buna benzer bir şey sunup sunmadığını bilmiyorum.
websitex5.com blogunu yeniden oluşturmak istiyorsanız, CSS kodunu websitex5.com kaynak kodundan kopyalayabilirsiniz...
-----
<style>
/* Stili di di configurazione Blog */
... CSS kodu...
</style>
-----
... ve "Özel sayfalar"ın altındaki "3 Site Haritası"nda bu kısmı "Blog:Ana sayfa" olarak işaretleyin, ardından üstteki "Özellikler"e tıklayın ve ...
Özel kod:
</HEAD/> etiketinden önce
...kopyalanan CSS kodunu yapıştırın.
Daha sonra WebSiteX5'teki blog ayarlarında kenar boşluğunu "0" olarak ayarlayın ve aşağıdaki ekran görüntüsündeki gibi görünün.
Kendi CSS kodunuzu eklerseniz tasarımı daha da özelleştirebilirsiniz.
======= (Almanca / Deutsch / German ) =======
Ich weiß nicht, ob Incomedia sowas auch für die Käufer von WebSiteX5 anbietet.
Wer den Blog von websitex5.com nachbauen will, der kann den CSS-Code aus dem Quelltext von websitex5.com kopieren ...
-----
<style>
/* Stili di di configurazione Blog */
... CSS-Code ...
</style>
-----
... und bei "3 Sitemap" unten bei "Spezialseiten" diesen Teil "Blog:Hauptseite" markieren, dann oben auf "Eigenschaften" klicken und im Reiter "Erweitert" bei ...
Benutzerdefinierter Code:
Vor dem </HEAD/>-Tag
... den kopierten CSS-Code einfügen.
Dann in den Blogeinstellungen bei WebSiteX5 den Rand auf "0" setzen, dann sie es so aus wie auf dem Screenshot unten.
Wer noch selber CSS-Code hinzufügt, der kann das Design weiter anpassen.
----- Önceden -----
----- Sonrasında -----
(Türkçe)
Blog tasarımlarını Websitex5.com'un daha modern blog tasarımına uyarlamak isteyen herkes için talimatlarım burada.
Talimatları Almanca yazdım. Gerekirse Google veya tarayıcı eklentileriyle çevirin.
(English)
Here are my instructions for anyone who wants to adapt their blog design to the more modern blog design from Websitex5.com.
I wrote the instructions in German. If necessary, translate with Google or browser add-on.
-----------------
(Deutsch)
Hier meine Anleitung für Alle, die ihr Blogdesign an das modernere Blogdesign von Websitex5.com anpassen wollen.
Von der Webseite websitex5.com muss kein CSS-Code kopiert werden, die wichtigen Teile des benötigten CSS-Codes habe ich herausgesucht unter Punkt D) aufgelistet, es sind nur 3 CSS-Zeilen.
WebSite X5 Einstellungen
=================
A) Beim Button "Lesen" die Beschriftung ändern und geschützte Leerzeichen als Abstand zum Rand hinzufügen
1 Einstellungen > Allgemeine Informationen
Sprache der Website:
DE - German_________________________ v [/] <--- Symbol anklicken
Spachzentrum
blog_read_all Weiterlesen
(Anmerkung: Geschützte Leerzeichen einfügen für Abstand von Text zum Rand)
B) Beim Button "Lesen" das Design ändern und die Rahmen um die Artikel entfernen
3 Sitemap
Oben bei Menü ...
Homepage
[☰|☰] Aktuelles <---- Blogseite markieren und oben auf "Bearbeiten" klicken
Dann bei "Elemente" den [ Button ] auswählen und bei Eckradius den Wert "20" eingeben und bei Schriftgröße z.B. 12
Hier evtl. auch bei den anderen Elementen links den Rand auf "transparent" setzen und rechts bei Schatten das Häkchen entfernen, damit es keinen Rand um den Blogbeitrag gibt.
C) Rahmen um die Seitenblöcke beim Blog entfenen
1 Einstellungen > Blog
Hier den Reiter "Seitenblöcke" anklicken und jeden Titel nacheinander markieren und auf "Bearbeiten" klicken
Dann jeweils den Reiter "Stil" anklicken und bei "Stil:" links alle Seiten auf "transparent" setzen und rechts bei Schatten das Häkchen entfernen
D) Schwarze Linie über dem Datum entfernen
3 Sitemap
Spezialseiten
Blog: Hauptseite <---- markieren und oben auf "Eigenschaften" klicken
Dann im Reiter "Erweitert" bei ...
Benutzerdefinierter Code:
Vor dem </HEAD>-Tag
... noch diese Zeilen hinzufügen ...
<style>
.imBlogPostCardCover, .imBlogPostCover { border-radius: 30px; } /* Eckradius bei Bildern */
.imBlogSeparator { border-bottom: 0px solid; } /* Schwarze Trenlinie entfernt */
.imBlogPostCardButton { text-align: left; } /* Button links platziert */
</style>
Ich hoffe, dass ich nichts von den Änderungen auf meiner Webseite vergessen habe.
-----
Korrektur bzw. Erweiterung:
Bei meiner Anleitung den CSS-Code bei Punkt D) stark erweitert, da viele Angaben leider fehlten.
Ich habe den CSS-Code vom Blog der Webseite websitex5.com analysiert und getestet, um nur die wichtigen Teile des CSS-Codes zu übernehmen, damit die Nutzer beim Kopieren nicht überfordert sind.
Die Angaben im CSS-Code habe ich kommentiert, damit deutlich wird wozu die Angaben dienen.
----- Überarbeitete Anleitung beim Punkt D) -----
D) Design der Blogseiten
Betrifft Angaben zum Eckradius der Bilder, zu schwarze Trennlinie entfernen, Button links platzieren, bei den Seitenblöcken die Titel gelb unterstreichen und gelbe Dreiecke vor die Links setzen.
3 Sitemap
Spezialseiten
Blog: Hauptseite <---- markieren und oben auf "Eigenschaften" klicken
Dann im Reiter "Erweitert" bei ...
Benutzerdefinierter Code:
Vor dem </HEAD>-Tag
... noch diese Zeilen hinzufügen ...
----- CSS-Code -----
<style>
.imBlogPostCardCover, .imBlogPostCover { border-radius: 30px; } /* Eckradius bei Bildern */
.imBlogSeparator { border-bottom: 0px solid; } /* Schwarze Trennlinie entfernen */
.imBlogPostCardButton { text-align: left; } /* Button links platzieren */
.imBlogPostCard.imBlogPostCardWithCover {
padding-left: 40px!important; /* Abstand der Blogbeiträge zum linken Seitenrand */
padding-right: 40px!important; /* Rechter Abstand der Blogbeiträge zu den Seitenblöcken */
}
.imBlogBlockTitle {
font-weight: bold;
font-family: Montserrat;
border-bottom: 2px solid #FFE12F;
padding-bottom: 5px;
margin-bottom: 10px;
} /* Titel unterstrichen mit gelber Linien */
.imBlogBlock li:before {
content: "\f0da";
font-family: FontAwesome;
color: #FFE12F;
font-weight: normal;
display: inline-block;
margin-left: -0.7em;
width: 0.7em;
} /* Gelbe Dreiecke vor den Links in den Seitenblöcken platzieren */
</style>
Ich hoffe, dass ich diesmal nichts von meinen Änderungen auf meiner Webseite vergessen habe.
Vielleicht können die CSS-Experten noch das Problem mit dem geringen Abstand bei der Artikelseite lösen, meine Versuche (geringe CSS-Kenntnisse) hatten leider keinen Erfolg, siehe Screenshot unten
----- Hauptseite ok -----
----- Artikelseite mit zu geringem Abstand -----