Profil | Mitglieder | Registrieren | Start | Suche


PHP-Support.de » Programmierung » PHP & MySQL » Codeschnipsel » Einfache css Format Bar für Foren, Gb's oder Ähnliches    » Hallo Gast [Login | Registrieren]

Neues Thema | Antworten   

Autor Beitrag
Andy16823
Mitglied
Aktiver User


Dabei seit: 21.11.2012
Herkunft: keine Angabe
Posts: 139
     Einfache css Format Bar für Foren, Gb's oder Ähnliches Zitat | Bearbeiten

Hallo Zusammen nun Mag ich mal meinen Ersten Code Schnipsel Veröffentlichen. Er Ist Sicher Nicht Perfekt und Muss noch Behandelt werden. Naja Soll ja Auch nur ein Code Schnipsel Sein.




Ihr Braucht
1x css Datei
1x html oder php datei

1: CSS

 PHP 
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:

// Für die Erstellung der Buttons

.buttonflach {
    background-color:#E5E5D9;
    border:1px solid;
    border-top-color:#E5E5D9;
       border-left-color:#E5E5D9;
       border-right-color:#E5E5D9;
       border-bottom-color:#E5E5D9;    
    
}


2. Das Herz Stück Die html seite, ich habe eine php seite genommen wegen benutzer Rechten
Im Header Werden Die Java Scripte Eingefügt wie Folgt




 PHP 
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:

// Java Scripte im Header

<head>
<script type="text/javascript">
function Bold() {
       var Ergebnis = document.Neuesforum.text.value + "[bold] IHR TEXT [/bold]";
       document.Neuesforum.text.value = Ergebnis;
    }

function Italic() {
       var Ergebnis = document.Neuesforum.text.value + "[italic] IHR TEXT [/italic]";
       document.Neuesforum.text.value = Ergebnis;
    }
function Underline() {
       var Ergebnis = document.Neuesforum.text.value + "[ul] IHR TEXT [/ul]";
       document.Neuesforum.text.value = Ergebnis;
    }
function Bild() {
       var Ergebnis = document.Neuesforum.text.value + "[img] Link Zu Ihrem Bild [/img]";
       document.Neuesforum.text.value = Ergebnis;
    }
function Link() {
       var Ergebnis = document.Neuesforum.text.value + "[Link] http:// [/Link]";
       document.Neuesforum.text.value = Ergebnis;
    }
</script>
</head>


<?php
echo "<form name='Neuesforum' method='post' action='newforumbest.php'>";
            echo 
"<table width='90%' align='center'>";
            echo 
"<tr><th colspan='2'>Erstelle Ein neues Forum<th></tr>";
            echo 
"<tr><td width='25%'>Themen Name:</td><td width='75%'><input type='text'name='ForumName' Value='Forum Name' style='width:100%'></td>";
            echo 
"<tr><td width='25%'></td><td bgcolor='#E5E5D9'>";
            echo 
"<button class='buttonflach' name='bold' type='button' onclick='Bold()'><img src='images/textbar/format-text-bold-5.png'></button>";
            echo 
"<button class='buttonflach' name='ital' type='button' onclick='Italic()'><img src='images/textbar/format-text-italic-5.png'></button>";
            echo 
"<button class='buttonflach' name='ul' type='button' onclick='Underline()'><img src='images/textbar/format-text-underline-5.png'></button>";
            echo 
"<button class='buttonflach' name='bild' type='button' onclick='Bild()'><img src='images/textbar/bild.png'></button>";
            echo 
"<button class='buttonflach' name='link' type='button' onclick='Link()'><img src='images/textbar/link.png'></button>";
            
            echo 
"</td></tr>";
            echo 
"<tr><td width='25%'></td><td bgcolor='#E5E5D9'><textarea style='width:100%' align='center' name='text' cols='50' rows='10'>Ihre Bescreibung</textarea></td></tr>";
            echo 
"<tr><td colspan='2' align='center'><input type='submit' name='senden' Value='senden'></td></tr>";
            echo 
"</table>";
            echo 
"</form>";
?>




Und So Seht es aus (bei meiner Formatierten tabelle)




Ich würde mich sehr über ein feedback freuen

LG Andy

UPDATE WICHTIGE Änderungen


Mein Neues Projeckt:
www.das-java-forum.com und


Post wurde schon 5x editiert, das letzte mal am 12.12.2012 um 20:08 von Andy16823
12.12.2012, 17:00 Profil | PM | E-Mail  
FalkenaugeMihawk
Mitglied
Perfekter User


Dabei seit: 05.06.2010
Herkunft: Schweiz
Posts: 2619
      Zitat | Bearbeiten

Der JS-Teil fehlt komplett. Wenn du schon bitte so etwas postest, dann bitte komplett. Vorher soll bitte ein Anfänger den JS-Code nehmen? Aus seinem Kopf bestimmt nicht.


12.12.2012, 18:04 Profil | PM | E-Mail  
Andy16823
Mitglied
Aktiver User


Dabei seit: 21.11.2012
Herkunft: keine Angabe
Posts: 139
      Zitat | Bearbeiten

Habe Es nun Abgeändert mit Javascript tags im Head


Zitat:
Orginal von Andy16823
Hallo Zusammen nun Mag ich mal meinen Ersten Code Schnipsel Veröffentlichen. Er Ist Sicher Nicht Perfekt und Muss noch Behandelt werden. Naja Soll ja Auch nur ein Code Schnipsel Sein.




Ihr Braucht
1x css Datei
1x html oder php datei

1: CSS

 PHP 
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:

// Für die Erstellung der Buttons

.buttonflach {
    background-color:#E5E5D9;
    border:1px solid;
    border-top-color:#E5E5D9;
       border-left-color:#E5E5D9;
       border-right-color:#E5E5D9;
       border-bottom-color:#E5E5D9;    
    
}


2. Das Herz Stück Die html seite, ich habe eine php seite genommen wegen benutzer Rechten
Im Header Werden Die Java Scripte Eingefügt wie Folgt




 PHP 
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:

// Java Scripte im Header

<head>
<script type="text/javascript">
function Bold() {
       var Ergebnis = document.Neuesforum.text.value + "[bold] IHR TEXT [/bold]";
       document.Neuesforum.text.value = Ergebnis;
    }

function Italic() {
       var Ergebnis = document.Neuesforum.text.value + "[italic] IHR TEXT [/italic]";
       document.Neuesforum.text.value = Ergebnis;
    }
function Underline() {
       var Ergebnis = document.Neuesforum.text.value + "[ul] IHR TEXT [/ul]";
       document.Neuesforum.text.value = Ergebnis;
    }
function Bild() {
       var Ergebnis = document.Neuesforum.text.value + "[img] Link Zu Ihrem Bild [/img]";
       document.Neuesforum.text.value = Ergebnis;
    }
function Link() {
       var Ergebnis = document.Neuesforum.text.value + "[Link] http:// [/Link]";
       document.Neuesforum.text.value = Ergebnis;
    }
</script>
</head>


<?php
echo "<form name='Neuesforum' method='post' action='newforumbest.php'>";
            echo 
"<table width='90%' align='center'>";
            echo 
"<tr><th colspan='2'>Erstelle Ein neues Forum<th></tr>";
            echo 
"<tr><td width='25%'>Themen Name:</td><td width='75%'><input type='text'name='ForumName' Value='Forum Name' style='width:100%'></td>";
            echo 
"<tr><td width='25%'></td><td bgcolor='#E5E5D9'>";
            echo 
"<button class='buttonflach' name='bold' type='button' onclick='Bold()'><img src='images/textbar/format-text-bold-5.png'></button>";
            echo 
"<button class='buttonflach' name='ital' type='button' onclick='Italic()'><img src='images/textbar/format-text-italic-5.png'></button>";
            echo 
"<button class='buttonflach' name='ul' type='button' onclick='Underline()'><img src='images/textbar/format-text-underline-5.png'></button>";
            echo 
"<button class='buttonflach' name='bild' type='button' onclick='Bild()'><img src='images/textbar/bild.png'></button>";
            echo 
"<button class='buttonflach' name='link' type='button' onclick='Link()'><img src='images/textbar/link.png'></button>";
            
            echo 
"</td></tr>";
            echo 
"<tr><td width='25%'></td><td bgcolor='#E5E5D9'><textarea style='width:100%' align='center' name='text' cols='50' rows='10'>Ihre Bescreibung</textarea></td></tr>";
            echo 
"<tr><td colspan='2' align='center'><input type='submit' name='senden' Value='senden'></td></tr>";
            echo 
"</table>";
            echo 
"</form>";
?>




Und So Seht es aus (bei meiner Formatierten tabelle)




Ich würde mich sehr über ein feedback freuen

LG Andy

UPDATE WICHTIGE Änderungen



Mein Neues Projeckt:
www.das-java-forum.com und


Post wurde schon 1x editiert, das letzte mal am 12.12.2012 um 20:08 von Andy16823
12.12.2012, 20:07 Profil | PM | E-Mail  
DingsDaBums
Mitglied
Exzellenter User


Dabei seit: 12.09.2010
Herkunft: keine Angabe
Posts: 2496
      Zitat | Bearbeiten

Zitat:
Orginal von FalkenaugeMihawk
Der JS-Teil fehlt komplett. Wenn du schon bitte so etwas postest, dann bitte komplett. Vorher soll bitte ein Anfänger den JS-Code nehmen? Aus seinem Kopf bestimmt nicht.


Da hast du ihn aber nett auf den Fehler aufmerksam gemacht /ironie off

Dass man nicht selber den JavaScript Code schreiben soll, sollte doch klar sein. Also hättest du auch einfach nur schreiben können, dass der JavaScript Teil fehlt...


@Andy16823
Ich fände es so umständlicher (als Benutzer), als wenn ich den BBCode per Hand eingebe und irgendwo ein Fragezeichen ist, auf das ich klicken kann, um mir anzeigen zu lassen, welche Tags ich verwenden kann.

Wenn würde ich es so machen, dass man beim ersten mal klicken auf den Button den öffnenden Teil an den Text angehängt bekommt und beim zweiten Mal klicken dann eben den schließenden.
Oder eben auch den markierten Text mit den Tags umschließen. Die Funktion zum abfragen des Textes, der markiert ist, finde man bei Google sehr schnell.
Wenn ich morgen Zeit habe, suche ich dir denn vielleicht mal raus.

Sonst wäre so eine einfache Bar zum leichten Umgang mit BBCode für kleiner Projekt recht praktisch. Dann muss man auch nicht so WYSIWYG Editoren benutzen, die viel zu überladen für manche kleiner Projekte sind, einbinden.

Edit:
Ich würde den JavaScript Teil etwas kürzen. Du wiederholst sehr viel Code, könntest es aber leicht in nur eine Funktion packen, die dann auch flexibler ist, wenn du die Bar um neue Tags erweitern möchtest.
 PHP 
1:
2:
3:
4:
5:
6:

function addBBCode( tag )
{
    var Ergebnis = document.Neuesforum.text.value + '['+tag+'] IHR TEXT [/'+tag+']'; 
    document.Neuesforum.text.value = Ergebnis; 
}


Dann muss nur statt
Zitat:
<button class='buttonflach' name='bold' type='button' onclick='Bold()'><img src='images/textbar/format-text-bold-5.png'></button>

folgendes geschrieben werden
Zitat:
<button class='buttonflach' name='bold' type='button' onclick='addBBCode("bold")'><img src='images/textbar/format-text-bold-5.png'></button>


Und wieso gibst du das komplette Form per PHP aus? Vielleicht habe ich was übersehen, aber ich sehe da keine Variablen oder ähnliches.
Dann kannst du doch den HTML Code direkt in die Datei schreiben. Dafür ist ja kein PHP nötig.


Schau mal bei meinem Projekt vorbei. Vielleicht ist das ja was für dich MyStartPanel - Deine persönliche Startseite mit deinen Favoriten
Auf der Suche nach einem guten Vokabeltrainer? Vokabeltrainer Cramfire - Schnell und effektiv Vokabeln lernen

Post wurde schon 3x editiert, das letzte mal am 16.12.2012 um 20:39 von DingsDaBums
16.12.2012, 20:29 Profil | PM | E-Mail  
Andy16823
Mitglied
Aktiver User


Dabei seit: 21.11.2012
Herkunft: keine Angabe
Posts: 139
      Zitat | Bearbeiten

Ich habe in meinem Forum eine Funktion ob eine Session Registriert ist oder nicht (ist sie nicht Registriert wird eine Erstellt für den Benutzer gast) im Zweiten Schritt frage ich Die Benutzer Rechte ab, ob der Benutzer als Gast Beispielsweise Überhaut ein Neues Forum eröffnen Darf. Deswegen hab ich eine php datei. und der Teil des Codes für die Bar den Hier Gepostet Habe befindet sich wie folgt

 PHP 
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
<?php

// Forheriger Code Teil

if ($NeuesThema == "Ja")
{
// Code Für Die Toolbar
}
else
{
echo 
"Sie Haben Keine Berechtigung ein neues Forum zu Erstellen.";
}

?>



Mein Neues Projeckt:
www.das-java-forum.com und


Post wurde schon 2x editiert, das letzte mal am 17.12.2012 um 19:16 von Andy16823
17.12.2012, 19:14 Profil | PM | E-Mail  
Seiten (1):  1 
PHP-Support.de » Programmierung » PHP & MySQL » Codeschnipsel » Einfache css Format Bar für Foren, Gb's oder Ähnliches   

Neues Thema | Antworten   


Powered by Command Board 1.0 - Beta 2.0 © 2004-08 PHP-Einfach | Impressum | Datenschutz