BlogEngine i NicEdit

4

BlogEngine.NET instaluje się standardowo z edytorem TinyMCE. Z kilku różnych względów nie do końca mi to odpowiadało – postanowiłem więc wstawić w jego miejsce NicEdit. Projekt jest jeszcze w fazie BETA, ale moim skromnym zdaniem zmierza prostą ścieżką prowadzącą niechybnie do sięgnięcia po tytuł “The Best WYSIWYG Editor Ever” (o ile taki powstanie).


Krótka instrukcja wstawienia najbogatszej wersji NicEdit na strony administracyjne:



  1. Ze strony projektu (http://nicedit.com/) ściągamy pliki nicEdit.js oraz nicEditorIcons.gif

  2. Umieszczamy je w katalogu ~/admin

  3. Z kontrolki htmlEditor.ascx usuwamy linijki:
    <%@ Register Src=”tinyMCE.ascx” TagName=”tinyMCE” TagPrefix=”uc1″ %>
    oraz
    <uc1:tinyMCE id=”TinyMCE1″ runat=”server”>

  4. Do tejże samej kontrolki wpisujemy:
    <SCRIPT type=”text/javascript”>
    bkLib.onDomLoaded(
    function(){
    new nicEditor({fullPanel:true,iconsPath:'<%=Utils.RelativeWebRoot%>admin/nicEditorIcons.gif’}).panelInstance(‘<%= TinyMCE1.ClientID %>’)
    })
    </SCRIPT>
    <asp:TextBox id=”TinyMCE1″ runat=”server” Rows=”25″ TextMode=”multiline” Width=”100%”>

  5. edit: wzbogacamy ten sam plik o linijkę <SCRIPT src=”<%=Utils.RelativeWebRoot%>admin/nicEdit.js” type=text/javascript></SCRIPT> – THX Przemo za czujność!

Włala!



Update 1 (29 lutego 2008):
Dodatkowy tip: aby zwiększyć obszar edytora HTML (czystego HTML dostępnego po kliknięciu na ikonę z niebieskim krzyżykiem) należy edytować plik nicEdit.js, odnaleźć linijkę zawierającą <textarea id=”nicHTMLArea” …. > i zmienić właściwości wg własnych preferencji. Przykładowo u mnie wygląda to teraz tak: <textarea rows=”25″ id=”nicHTMLArea” style=”width: 100%; text-align: left; font-size: 13px; height: 500px; border: 0; border-bottom: 1px solid #ccc;”>.



Update 2 (1 marca 2008):
Małe “issue”: po wyrzuceniu TinyMCE pozbywamy się funkcjonalności AutoSave przy dodawaniu posta. W celu wyeliminowania błędów JavaScript z tym związanych należy zakomentować końcówkę pliku admin/Add_entry.aspx w taki sposób:
<br />
<%–<% if (Request.QueryString[“id”] == null){ %>
<script type=”text/javascript”>
setTimeout(“AutoSave()”, 5000);
</script>
<%} %>
–%>
</asp:Content>
.

Nie przegap kolejnych postów!

Dołącz do ponad 9000 programistów w devstyle newsletter!

Tym samym wyrażasz zgodę na otrzymanie informacji marketingowych z devstyle.pl (doh...). Powered by ConvertKit
Share.

About Author

Programista, trener, prelegent, pasjonat, blogger. Autor podcasta programistycznego: DevTalk.pl. Jeden z liderów Białostockiej Grupy .NET i współorganizator konferencji Programistok. Od 2008 Microsoft MVP w kategorii .NET. Więcej informacji znajdziesz na stronie O autorze. Napisz do mnie ze strony Kontakt. Dodatkowo: Twitter, Facebook, YouTube.

4 Comments

  1. Aby to zadziałało trzeba jeszcze dodać do kontrolki htmlEditor.ascx taką linijkę:
    <script type="text/javascript" src="<%=Utils.RelativeWebRoot%>admin/nicEdit.js"></script>
    Przynajmniej u mnie ;)

  2. Przyznaję bez bicia – umknął mi ten krok w instrukcji:). Oczywiście trzeba takie coś dodać. Dzięki za czujność!

  3. A jak wam się udało rozwiązać problem wpisywania polskich literek. Ja testowałem sam edytorek i "wała"