Sto cercando un tutorial decente sulla creazione di skin per DotNetNuke 7. Non sono stato in grado di trovare nulla per la versione più aggiornata di dnn e sebbene abbia avuto qualche successo nella modifica di esistenti skin, sarebbe molto più facile essere in grado di costruirli da zero.Tutorial per skinning di DotNetNuke 7
Qualche suggerimento?
Non ho intenzione di entrare troppo nei dettagli, ma definirò alcuni degli elementi chiave su DotNetNuke Skinning e alcuni dei potenziali problemi che potresti incontrare.
Uno skin può essere scritto in uno dei due modi, html o ascx. Il modo più comune è attraverso un ascx.
html: quando si utilizza questo metodo, non verranno applicate tutte le modifiche apportate all'interno della pelle fino DotNetNuke analizza la pelle. Quando si analizza questo DotNetNuke, farà riferimento al manifest per analizzare correttamente tutti i valori in modo che vengano visualizzati.
ascx: questo modo non ha bisogno di essere analizzato, le modifiche apportate saranno immediatamente disponibili. Il che rende più semplice la manipolazione. Tuttavia, questo conterrà comunque un manifest per definire anche i tuoi contenuti.
Ora, il modo più semplice per immaginare DotNetNuke struttura è attraverso Panes e Containers. Essenzialmente un Pane sarà sempre incluso in un Container.
Ma come si progetta una pelle?
Poche cose da notare, con DotNetNuke si tende a non progettare un sito proprio per questo PAGE- È possibile creare strutture più elaborate che possono essere utilizzati in un senso più generale. Per esempio:
Quindi, con l'immagine qui sopra, si vede un paio di elementi chiave quali:
Quindi, in sostanza, abbiamo una struttura dati abbastanza semplice. Che di solito include un'organizzazione abbastanza di base. Ma la mia domanda è, come si spiega o dispositivi mobili o diversi layout di pagina, quali:
Ora avete un problema un po 'più complessa. Beh, lo DotNetNuke ha tenuto davvero alcune considerazioni: mantenere lo sviluppatore come sviluppatore, il designer come designer. Che consente ai grandi gruppi di lavorare con un sito la flessibilità senza distruggersi a vicenda.
In ogni DotNetNuke pelle vedrete questi:
<%@ Control language="C#" AutoEventWireup="false" Explicit="True" Inherits="DotNetNuke.UI.Skins.Skin" %>
<%@ Register TagPrefix="dnn" TagName="LOGO" Src="~/Admin/Skins/Logo.ascx" %>
Cosa sono quelli? Bene, il primo è definire il nostro ascx. L'importante è il secondo. Essenzialmente, DotNetNuke dispone di token, questi token consentiranno alla skin di riflettere le modifiche apportate entro l'interfaccia DotNetNuke.
Quindi, quando si fa riferimento alla posizione principale, piuttosto che a un oggetto statico. Ciò consente all'interfaccia DotNetNuke di inserire automaticamente il logo nella posizione.
Whoa, mi hai perso- Se questo è solo un riferimento, come si specifica la posizione?
<%@ Register TagPrefix="dnn" TagName="LOGO" Src="~/Admin/Skins/Logo.ascx" %>
Farà riferimento al nostro oggetto. Per specificare la posizione all'interno del nostro sito si dovrebbe fare questo:
<div class = "example_logo">
<dnn:LOGO runat="server" id="dnnLOGO" BorderWidth="0" />
</div>
quindi siamo essenzialmente avvolgendo il nostro oggetto token in un elemento div. Quindi stiamo effettivamente chiamando il nostro token. Questo posizionerà fisicamente il logo dall'interfaccia DotNetNuke al tuo sito ora.
Questo essenzialmente elimina l'approccio statico e consente di diventare dinamico.
Quindi questi sono importanti, ma come posso creare la struttura?
<div id="Origin">
<div class="Wrapper">
<div id="Origin-Header">
<div class="origin-header clearfix">
<!-- Header Elements -->
<div class=origin-logo>
<dnn:LOGO runat=server" id="dnnLOGO" BorderWidth="0" />
</div>
<div class="origin-login">
<dnn:LANGUAGE runat="server" id="dnnLANGUAGE" showMenu="false" showLinks="true" />
<dnn:LOGIN runat="server" id="dnnLOGIN" CssClass="login" /> | <dnn:USER runat="server" id="dnnUSER" CssClass="user" />
<dnn:SEARCH runat="server" id="dnnSEARCH" UseDropDownList="true" ShowSite="false" ShowWeb="false" />
</div>
</div>
</div>
!-- Banner -->
<div id = "Origin-Banner">
<div class = "origin-banner-pane" id="origin-banner-pane" runat="server" />
</div>
Così il sopra è un esempio per iniziare. Come vedi, usi le tue conoscenze essenziali per costruire la struttura del sito. Ti basta compilare il DotNetNuke Tokens nel tuo progetto. Quindi, dove desideri che i moduli DotNetNuke per riempire i tuoi siti dati dall'interfaccia DotNetNuke rientrino in quelli Panes.
Ora il prossimo aspetto importante sarà la confezione essenziale della vostra pelle. Ciò assicurerà che funzioni correttamente una volta installato.
È possibile ottenere ulteriori informazioni da http://www.dotnetnuclear.com e http://www.dnnchat.com
Speriamo che questo fornisce le nozioni di base per iniziare. Che lascia la confezione e si manifesta a sinistra.
Speriamo che questo vi guidi nella giusta direzione e aiuti.
Sentitevi liberi di fare domande o seguire questi siti per cercare di ottenere maggiori informazioni sull'argomento.
La soluzione migliore è probabilmente quella di guardare le skin esistenti fornite con DotNetNuke come inizio. Per creare una nuova skin basta andare nell'area/Portals/_default/skins e copiare una di queste directory incolla e rinominarla in qualcosa di unico. Questo dovrebbe ora apparire nel tuo selettore di pelle. Il 90% dei file .ascx skin sono solo HTML/CSS. È quindi possibile modificare il file skin.css e i file ASCX secondo necessità per ottenere l'aspetto desiderato. Per creare una nuova skin, basta creare un nuovo file .ascx.
Si potrebbe anche acquistare uno o due skin e dare un'occhiata a come sono stati sviluppati.
Penso che sia la strada da percorrere. Tuttavia, devi avere familiarità con la creazione di base dei moduli per DNN. – tatigo
Come sottolinea Chris Hammond nel primo commento, questi tutorial sono difficili da trovare. @ Chris - Grazie per aver scritto il modello di modulo. La comunità e io lo apprezzo.
Ho provato a conoscere le skin DNN e mi sono imbattuto nel sito Web DNN Hero che contiene un buon tutorial video di base su come creare una skin per un sito.
Si può trovare qui: http://www.dnnhero.com/Premium/Tutorial/tabid/259/ArticleID/80/1-How-to-create-my-first-skin-in-DotNetNuke-Part-1-6.aspx
Non credo che questa serie è nel set gratuito di video, quindi potrebbe essere necessario iscriversi per ottenerlo. Sono un abbonato e non sono stato deluso. Se hai bisogno di un'introduzione alle pelli o qualsiasi altra cosa DNN, il sito è davvero informativo.
Sfortunatamente per DNN Skins, le esercitazioni sono difficili da trovare da –
Non sono sicuro di quanto sia presto necessario, ma proverò a scrivere un blog a riguardo. – Greg
hey .. hai trovato qualcosa di utile .. Ho anche bisogno di progettare skin dall'inizio – shashwat