iduk.de.tl

HPBK - Design Editor 0.8 Beta

HPBK Optimizer Tool ( V 0.8 - Public Beta )

Dieses Tool bietet euch mehr Kompfort im Homepage-Baukasten, es verbreitert die wichtigsten Schreibfeler im Seiteneditor und im Design Editor. Das design wurde Farblich aber schlicht aufgewertet, damit sich das Tool von den andern Bereichen gut abhebt.

Verbesserungen:

1. Design anpassungn und veränderungen
2. Textfelder vergrößert für besseren Kompfort
3. Head bereich im Seiteneditor um 60% geschrumpft
4. Die Bilderseite wurde in mehreren Spalte unterteilt um eine bessere Übersicht zu bekommen
5. Im Seiteneditor wurde die Seiten-SIdebar erneuert
6. Bei der Designauswahl wird nun werbung von Designpages erscheinen und eine bessere Vorschau wurde hinzugefügt
7. Auswahl auf die Designs Iceblue und CSS (Profidesign) verkleinert!
8. und noch einiges mehr!

Beispiel:

Tutorial:

Für dieses Tool brauchst du das Firefox Addon Stylish.

1. gehe unten in der rechten Ecke auf das S Symbol
2. dann auf Stil erstllen > Neuer Stil
3. Gebe dem Tool (Stil) einen Namen z.B. "HPBK Design Editor"
4. In dem großen Feld kopierst du folgendes rein:
   @namespace url(http://www.w3.org/1999/xhtml); @-moz-document url-prefix(http://www.homepage-baukasten.de/editpage.php), url-prefix(http://www.homepage-baukasten.de/design.php), url-prefix(http://www.homepage-baukasten.de/bilder.php) { /* Beispiel bilder der Auswahl */ img[src="http://theme.webme.com/designs/iceblue/screen.PNG"] { background-image:url(http://img.webme.com/pic/i/iduk/iceluepreview.png); background-repeat:no-repeat; height:0px !important; width:0px !important; padding-left:620px; padding-top:200px; } img[src="http://theme.webme.com/designs/css-only/screen.PNG"] { background-image:url(http://img.webme.com/pic/i/iduk/cssprewiev.png); background-repeat:no-repeat; height:0px !important; width:0px !important; padding-left:620px; padding-top:200px; } /* CSS Tool */ body {background:#FFFFFF !important;} #bkbox_content_1 .formrow textarea, .formrow_ac textarea,.formrow_textarea { width:98% !important; height:300px !important; background-image:none !important; border:none; margin-left:10px !important; margin-right:10px !important; color:#666666; font-family:"Courier New",Courier !important; font-size:12px; height:300px; padding:3px; -moz-border-radius:8px; } .tabs_area { background:white none repeat scroll 0 0; border:#808080 solid 1px !important; font-weight:normal; left:10px !important; margin-left:10px; margin-top:23px; min-height:200px !important; padding:0; position:relative; width:98% !important; -moz-border-radius-topleft:0px; -moz-border-radius-topright:10px; -moz-border-radius-bottomleft:10px; -moz-border-radius-bottomright:10px; } #form_label4, #form_label5, #form_label6, #form_label7 {width:100% !important; } label #form_label3, .bkbox_title_corner, .bkbox_title_ru, .bkbox_corner, .bkbox_bottom, .bkbox_menu_img,#form_label3 {display:none !important;} #textarea_3 {margin-left:0px !important;width:100% !important;} #tabs_li_1, #tabs_li_2, #tabs_li_3, #tabs_li_4, #tabs_li_5 { background-image:none !important; background:#ccc; border:1px solid #808080; -moz-border-radius-topleft:8px; -moz-border-radius-topright:8px; } #tabs_li_1:hover, #tabs_li_2:hover, #tabs_li_3:hover, #tabs_li_4:hover, #tabs_li_5:hover { background:#EFEFEF; } #tabs_r_1, #tabs_r_2, #tabs_r_3, #tabs_r_4, #tabs_r_5{ display:none; } .tabs {margin-left:9px;} #form_element1,#form_element2,input,select { background-image:none !important; -moz-border-radius:8px !important;} select {padding:3px !important;padding-right:5px !important;} input[type=submit] { background-image:none !important; background:#ccc; border:1px solid #808080; -moz-border-radius:8px;} .formrow_ac { background-color:#EFEFEF !important; font-weight:bold; position:relative; } /* Allgemeines Css */ #baukasten_right { background:#FFF1AF !important; border:1px solid #FFD100 !important; -moz-border-radius:8px; padding-top:0px !important; background-image:url(http://wtheme.webme.com/img/menu_bg.gif) !important; background-repeat:repeat-x!important; } .bkbox_title,.bkbox_menu_link_ac,#bkbox_menu_bilder_neu,#bkbox_menu_reiter_extended,#bkbox_menu_1 { background:#EFEFEF !important; border:1px solid #808080 !important; -moz-border-radius-topleft:8px; -moz-border-radius-topright:8px; background-image:url(http://img.webme.com/pic/i/iduk/zahnradbg.png) !important; background-repeat:no-repeat !important; width:190px; text-shadow: #aaa -2px 1px 1px; margin-top:-1px; color:#333; text-align:center !important; font-size:14px; } .bkbox_menu_link_ac {border-bottom:none !important;margin-top:-8px !important;margin-left:0px !important;} .bkbox_title {border-bottom:none !important;margin-top:0px !important;margin-left:-1px !important;} .bkbox_menu_link_ac #bkbox_menu_reiter_extended,.bkbox_menu_link_ac #bkbox_menu_bilder_neu {background:none !important;border:none !important;} .bkbox_menu_link_ac #bkbox_menu_1 {background:none !important;border:none !important;} .bkbox_menu_link a:hover {color:#000 !important;} #bkbox_menu_reiter_extended,#bkbox_menu_bilder_neu {margin-top:4px !important;margin-left:10px !important;} #bkbox_menu_1{margin-top:4px !important;margin-right:10px !important;} h2 {font-size:18px !important;} #baukasten_right h1{ font-size:0px !important; text-shadow: #FFF1AF 2px 1px 1px; background:url(http://img.webme.com/pic/i/iduk/hpbkdesigneditorv01beta.png); background-repeat:no-repeat; height:75px; margin-left:-10px !important;} .bkbox { background:#EFEFEF !important; border:1px solid #808080 !important; -moz-border-radius-bottomleft:8px; -moz-border-radius-bottomright:8px; -moz-border-radius-topright:8px; background-image:none !important; width:100%; min-width:680px !important; } #form_row4 .button_color {margin-left:20px !important;} #form_row6 .button_color {margin-left:20px !important;} select[id="form_element5"]{margin-left:20px !important;} select[id="form_element7"]{margin-left:20px !important;} option[value="butterfly"] {display:none !important;} option[value="red"] {display:none !important;} option[value="colourful"] {display:none !important;} option[value="gelb"] {display:none !important;} option[value="urlaub"] {display:none !important;} option[value="skater"] {display:none !important;} option[value="autos"] {display:none !important;} option[value="anime"] {display:none !important;} option[value="tiere"] {display:none !important;} option[value="love"] {display:none !important;} option[value="flash"] {display:none !important;} option[value="fussball"] {display:none !important;} option[value="musik"] {display:none !important;} option[value="women"] {display:none !important;} option[value="gaming"] {display:none !important;} option[value="men"] {display:none !important;} option[value="katzen"] {display:none !important;} option[value="kaki"] {display:none !important;} option[value="schlicht"] {display:none !important;} option[value="beige"] {display:none !important;} option[value="green"] {display:none !important;} #expand { background:#DFDFDF !important; background-image:none !important; -moz-border-radius-topright:8px; -moz-border-radius-bottomright:8px; } #menu_dragme { padding-top:10px !important; height:100% !important; } #editor_menu { background-position:right center; border-right:1px solid #D1D1D1; margin-bottom:29px; padding-left:0; width:240px; background:#DFDFDF; } #editor_menu td { padding:0; } #editor_r { padding-left:26px; padding-right:26px; padding-top:12px; } #editor_r h2 { display:block; margin-bottom:8px; } #editor_r_r { position:absolute; right:26px; top:48px; } #editor_menu ul { margin:0; padding:0; } #editor_menu li { background-image:none !important; background-repeat:no-repeat; display:block; height:49px; margin-top:-5px !important; width:150px; margin-left:3px !important; margin-right:3px !important; margin-bottom:8px !important; -moz-border-radius:8px; } #editor_menu li:hover { background-color:#FFEB8F !important; background-image:none !important; } #editor_menu li a, .addpage li a { cursor:pointer; display:block; height:15px !important; padding-left:30px !important; padding-top:5px !important; text-decoration:none; width:120px !important; } #editor_menu ul ul { margin-bottom:0px !important; margin-left:30px !important; } #editor_menu ul ul li { background-image:none !important; background-repeat:no-repeat; display:block; height:25px; margin:0; width:146px; } .editor_subpage_list { background-image:none !important; background-repeat:no-repeat; display:block; height:12px !important; margin-left:0 !important; padding-left:0 !important; width:146px; } .editor_subpage_link { height:31px !important; margin-left:0 !important; padding-left:30px !important; padding-top:3px !important; font-size:10px !important; } .editor_subpage_link:hover { color:#000 !important; font-weight:bold; } #editor_menu ul ul li:hover { background-image:none !important; } .checkbox_caption { display:inline; font-size:12px; margin-left:4px; position:relative; top:-4px !important; } .editor_menu_ac { font-weight:bold; } #editor_content { font-size:12px; padding-top:18px; width:100%; } .info_outer, .notice_outer { border-color:#D5D4D0; border-style:solid; border-width:1px 0; line-height:19px; padding:1px 0; } .info, .notice { background-color:#FFF6D8; padding:14px 21px; } .info_outer { border-color:#EDEDEB; } .info { background-color:#F6F6F6; } .bkbox .info_outer, .bkbox .notice_outer { margin-bottom:20px; margin-left:1px !important; margin-right:5px; margin-top:5px; } .bkbox .info, .bkbox .notice { padding-left:28px; } .bkbox .info h4, .bkbox .notice h4 { font-size:12px; margin:0; padding:0; } .bkbox .info p { margin:0; padding:0; } #options { margin-top:-10px !important; } #editpage_edit_main_login { float:left !important; margin-top:-46px; width:65px; margin-left:220px !important; } .extra9 {margin-top:-10px;} #editpage_edit_main_subpage_select { float:left !important; margin-top:-32px; margin-left:200px !important; height:27px !important; width:60px; } #editpage_edit_main_titel { margin-bottom:5px; } #arrows_table { float:right; margin-top:-25px; margin-right:-30px !important; padding-top:10px; width:20px !important; } #bildwaehler_button { margin-top:0px;} .dragitem:hover { background:#000 !important; } .dragitem { overflow:auto; max-height:100px !important; padding-bottom:2px !important; border-bottom:1px solid #808080 !important; } img[src="http://wtheme.webme.com/images/progress.gif"] {margin-top:50px;height:0px;width:0px;padding-top:63px;padding-left:70px;background-image:url(http://img.webme.com/pic/i/iduk/108.gif);} img[src="http://img.webme.com/images/progress.gif"] {margin-top:50px;height:0px;width:0px;padding-top:63px;padding-left:70px;background-image:url(http://img.webme.com/pic/i/iduk/108.gif);} #html___Frame,#html {height:750px!important;-moz-border-radius:8px !important;} #TB_overlay {background:#FFF1AF !important;} #TB_window {-moz-border-radius:15px !important;border-color:#FFD100 !important;background-color:#e1e2e4 !important;} #pics_list .formrow {float:left;width:270px;word-wrap:break-word;height:25px !important;} #pics_list .formrow_ac {float:left;width:270px;word-wrap:break-word;height:25px !important;} #action {margin-top:20px !important;} #pics_footer,#pics_catbar {background:none !important;} div[style="border: 1px solid white; padding: 5px; background-color: white;"] { background:none !important; border:none !important; -moz-border-radius:8px; } #editpage_message_text,#upload_message_text,#bilder_message_text,#designreiter_first_message_text { background:none !important; border:none !important; -moz-border-radius:8px; } img[src="http://img.webme.com/img/symbol2.gif"] { background-image:url(http://img.webme.com/pic/i/iduk/arrowdown.png); background-repeat:no-repeat; height:0px !important; width:0px !important; padding-left:20px; padding-top:20px; } img[src="http://img.webme.com/img/symbol1.gif"] { background-image:url(http://img.webme.com/pic/i/iduk/arrowup.png); background-repeat:no-repeat; height:0px !important; width:0px !important; padding-left:20px; padding-top:20px; } img[src="http://img.webme.com/img/symbol3.gif"] { background-image:url(http://img.webme.com/pic/i/iduk/error.png); background-repeat:no-repeat; height:0px !important; width:0px !important; padding-left:20px; padding-top:20px; } }
5.  Nun speichern
6. Fertig !

Noch bekannte Bugs:

Auf der Bilderseite wird bei dem 3. Bild nur eine Checkbox angezeigt. Dieser Fehler wird noch so schnell  wie möglich behoben.