Sidofält är bra i två fall: om de innehåller något så viktigt att de alltid ska finnas framför dina ögon (ta till exempel valfri e-postklient, och åtminstone Gmail) eller om du behöver kunna dölja detta viktigaste sak för att spara pengar platser (igen, som i Gmail, men i mobilversionen). Att ta på sig skapandet av sidofält från början är inte en uppgift för genomsnittliga sinnen, och det är generellt sett meningslöst. För en sådan uppgift är det bättre att använda lämplig ram. Vi kommer att prata om ett sådant exempel idag.

Kort om Webix

Nuget installera Webix
Eller om du föredrar Bower:

Bower installera webix
Allt ovanstående gäller direkt för Webix. För att kunna skapa sidofält behöver vi ett par till. Tillgång till dem via CDN:

Sidofält på exemplet med en e-postklient

Eftersom DataTable-översikten inte ingår i våra planer kommer jag inte att uppehålla mig i detalj, källkoden till exemplet kan ses nedan.

Låt oss börja med grunderna. För att lägga till en specifik komponent i applikationen använder Webix egenskapen se. Vi vill till exempel skapa en knapp:

Visa: "knapp"
För att initiera Webix-applikationen behöver vi följande kod:

// valfritt. koden kommer att exekveras efter att sidan har laddats webix.ready(function()( // webix.ui constructor(( // programbeskrivningsvy: "button", )); ));
Koden ovan skapar en sida som består av en enda knapp. Eftersom vår applikation består av flera komponenter behöver vi tänka på att skapa en layout. För att göra detta, använd egenskaperna rader Och cols, som används för att skapa rader och kolumner.

Till exempel:

Webix.ui(( cols: [ ( view: "button"), ( view: "button") ] ));
Det kommer redan att skapa två kolumner, en knapp i varje. Genom att kombinera dessa egenskaper, lägga till kapslade kolumner och rader, ändra deras storlekar, till exempel genom att använda egenskapen allvar du kan skapa en layout med den komplexitet som krävs.

Nu kan vi gå vidare till sidofältet. Den är baserad på trädkomponenten och använder även JSON-formatet för att beskriva dess struktur. För enkelhetens skull är det bättre att lagra en sådan beskrivning i en separat variabel.

Vår sidofält kommer att bestå av följande menyalternativ:

Var menu_data = [ (id: "inkorg", ikon: "kuvert", värde: "Inkorg"), ( /* andra objekt */ ), (id: "taggar", ikon: "taggar", värde:"Taggar ", data:[ ( id: "vänner", värde: "Vänner"), ( id: "arbete", värde: "Arbete"), ( id: "nyheter", värde: "Nyheter") ]) ],
Varje element måste ha ett unikt ID. värde bestämmer vad menyalternativets text kommer att vara, och ikon- en ikon. Webix använder Font Awesome-ikonuppsättningen. Var uppmärksam på objektet Tags. Den innehåller kapslade undermenyer som öppnas vid klick.

Så, sammanfattande av allt ovan, kan vi gå vidare till vår ansökan:

Webix.ui(( cols:[ /* första kolumn, sidofält */ (vy: "sidofält", data: menu_data, ), /* andra kolumn */ ( /* dataview-komponent */ ) ] ));
I princip är detta allt som krävs för att skapa en grundläggande sidofält: ange exakt vad denna komponent vi vill skapa, och välj även en datakälla om dess struktur.

Som ett resultat fick vi detta sidofält:

Provkod och demo kan ses.

Lägg till en knapp för att dölja sidofältet

Webix.ui(( rader:[ ( /* verktygsfältet kommer att finnas här */), (cols:[ ( /* sidofält */ ), ( /* våra e-postmeddelanden */ ) ]) ] ));
Låt oss ta en titt på koden vi behöver för att skapa rubriken. Som nämnts bestäms typen av skapad komponent av fastighetens värde se. I det här fallet kommer detta värde att vara verktygsfältet. Dess innehåll bestäms av fastighetens värde element. I vårt fall kommer vi att placera följande element i verktygsfältet: en hamburgerknapp, en titel och flera meddelandeikoner:

(vy: "verktygsfält", element: [ /* hamburgerknapp */ (vy: "knapp", skriv: "ikon", ikon: "staplar", bredd: 37, align: "vänster", css: "app_knapp " , klicka på: function()( $$("$sidebar1").toggle() ) ), /* header */ (vy: "label", etikett: "Webix E-Mail CLient"), ( /* lägg till tomt blanksteg */ ), /* notifikation 1 */ ( visa: "knapp", typ: "ikon", ikon: "envelope-o", bredd: 45, css: "app_button", märke:4), /* notification 2 */ ( view: "button", typ: "icon", icon: "bell-o", width: 45, css: "app_button", badge:10) ] ),
egenskapstyp: " ikon"Och icon: "ikonnamn" skapa ikonknappar. Fast egendom klick låter dig definiera en funktion som kommer att anropas vid klick. I det här fallet växlar det sidofältets tillstånd. Till de två sista knapparna har vi lagt till egenskapen bricka, vilket gör att du kan använda orange märken med siffror som motsvarar fastighetsvärdet.

Här är vad som hände till slut:

När de är minimerade förblir sidofältsmenyikonerna synliga. Genom att hålla muspekaren över dem kan du se innehållet i menyn och välja ett av alternativen.

Det öppnade sidofältet ser ut så här:

Och ja, lägg märke till meddelandeikonerna uppe till höger. Det är för dessa orange cirklar som vi använde fastigheten bricka.

Du kan prova det här exemplet och leka med koden här

Microsoft är mycket förtjust i att förse sina produkter med ganska kontroversiella gränssnittslösningar. Sedan Windows Vista, som både tekniskt och visuellt anses vara förfader till alla efterföljande system från Microsoft, tillämpades först tekniken för att visualisera ofta använda komponenter av användaren, liksom många andra typer av "förbättringar". Datorn började dock sakta ner på grund av överbelastning av systemet. Idag i vår artikel kommer vi att ta itu med en av dessa "tunga" processer - sidebar.exe.

Så låt oss prata om vad sidebar.exe är ansvarig för i Windows 7 och andra OS-versioner där denna process körs.
Säkert har du märkt mer än en gång i det högra området på skärmen en vertikal remsa med ikoner på den. Till exempel i Vista kan det vara vädret, kalendern, visuell klocka, och i senare versioner var det redan ofta använda applikationer på datorn och webbgränssnittselement. Dessa är de så kallade widgetarna.

Eller, som många brukade kalla dem, prylar. Som nämnts ovan ligger all denna skam i det högra vertikala området, som i programmeringsmiljön vanligtvis kallas "sidebar" (efter namnet på den process som ansvarar för detta - sidebar.exe). Vad det är är nu mer eller mindre klart. Tänk på hur det påverkar driften av maskinen som helhet.

Placera i systemet

I allmänhet är detta verktyg ett av de mest värdelösa som någonsin har implementerats i Windows. En användare som är van vid sin bil vet nästan med slutna ögon vad som finns var, och sidofältet är bara i vägen. Dessutom kan denna systemprocess ta upp ganska mycket RAM-minne och systemtid, vilket skulle kunna spenderas på mer användbara saker. För att bedöma hur mycket sidebar.exe "äter" systemresurser, gå bara till "Task Manager" och hitta den bland resten på fliken "Processer". Beroende på vilka widgets vår sidofält är utrustad med kan siffrorna variera från några kilobyte till ett par megabyte. Om dessa värden är gigabyte, så finns det ett annat problem, men mer om det nedan.

Processen använder för mycket minne

Som ni vet blir inte bara människor sjuka, utan även datorer. Det är ganska lätt att fånga ett virus på Internet. Oftast döljer sig skadlig programvara som filer och processer med tillägget .exe. Och sidebar.exe är inget undantag. Detta är en av de mest favorit "donatorerna" av skadlig programvara. För att kontrollera din dator, kör en systemsökning efter sidebar.exe. Den riktiga filen från Microsoft finns i mappen C:\Program Files, och den skadliga finns i C:\Windows eller C:\Windows\system32. Uppdatera snabbt ditt Anti-Virus, så kommer det att klara av denna datorinfektion utan större svårighet.

Ta bort sidofältet

Om du är trött på att systemet ständigt fryser på grund av denna process, undrar du troligen: hur tar man bort sidebar.exe? Vi har förberett två av de mest populära lösningarna.

Den första är den enklaste, och du kan dra upp den på ett nafs. Men det har en betydande nackdel - efter varje omstart av systemet återvänder widgetarna till sina platser igen och fortsätter att förstöra våra liv. Fundera på hur du snabbt blir av med sidebar.exe:

1. Tryck på tangentkombinationen Ctrl + Alt + Del - detta kallar "Task Manager";
2. Vi letar efter sidebar.exe bland andra processer;
3. Högerklicka på den och välj Inaktivera.

Allt! Nu bör systemet börja fungera snabbare. Tänk på det: om du bestämmer dig för att permanent inaktivera sidebar.exe, vad innebär detta? Hur lönsamt blir det att bli av med dessa prylar? Har du bestämt dig? Låt oss sedan börja:

1. Öppna "Start"-menyn och välj "Kör ...";
2. I fönstret som öppnas, skriv "msconfig" och klicka på "OK";
3. Ett fönster öppnas framför oss, där vi går till fliken "Startup";
4. Vi hittar vår sidofält och tar bort märket från det.

Dessa åtgärder kommer att inaktivera den automatiska starten av processen när operativsystemet startar. Vi rekommenderar inte att inaktivera okända inställningar, eftersom detta kan leda till allvarliga fel i operativsystemet.

problem med sidebar.exe

Det händer att processen fungerar, men själva widgetarna visas inte. Vad orsakar sidebar.exe-felet? Det vanligaste problemet är en felaktig Adobe Flash Player och webbläsaren Internet Explorer, eftersom det är han som är ansvarig för att ladda data från Internet till prylar. Installera om dessa komponenter och starta om själva sidofältet. Den finns i C:\Program Files\Windows Sidebar\sidebar.exe.
Om detta inte hjälper, ladda ner och installera komponenten från den officiella Microsoft-webbplatsen.
Nu borde allt vara klart med sidebar.exe: vilken typ av process det är och vilka funktioner den utför.
Har frågor? Fråga dem i kommentarerna!

Jag kan knappt hitta tid att skriva ytterligare en artikel i min blogg. Men, men ... jag ska göra det. Ett gäng fall, var kom de just ifrån?

Idag ville jag prata om vad som borde stå i bloggens sidofält. Och samtidigt kommer jag att beröra ämnet vad som är en bloggsidebar i allmänhet.

Hej alla vänner.

Bloggsidofält - vad är det och vad ska finnas i det?

Låt oss prata om detta:

• vad är en sidofält?
• varför till höger och varför en?
• Vad ska finnas i sidofältet på en blogg?

Vad är en sidofält?

Lite teori för att komma igång. Anledningen till att jag skrev detta inlägg var mitt besök på en av bloggarna, min läsare. Och "oavsiktlig" om jag får säga så.

I ungefär en månad tänkte jag skriva det här inlägget själv, men alla tyckte att det inte var viktigt, att det här ämnet kunde utelämnas. Men sedan följde ytterligare ett sådant besök, följt av ytterligare ett.

Kort sagt, jag har sett tillräckligt många skräckfilmer)))

Min blogg är långt ifrån idealisk. Jag jobbar som sagt på att ändra designen och göra layouten från grunden. Det här är saker för den närmaste framtiden. Då kommer det att vara möjligt att bedöma min design av bloggen i all allvar, men nu, låt oss gå med mig och försöka svara på huvudfrågan i detta inlägg.

Så vad är en sidofält? Du behöver inte ha djupa kunskaper inom främmande språk för att förstå att detta ord består av två ord - "sida" är en sida och "bar" är ... en dryckesanläggning))) "Bar" är en remsa.

Så om du ofta gillar att hänga på en bar, förvänta dig ett nytt band i ditt liv.

De där. en sidofält är ett slags sidofält, en sida som finns på din webbplats (blogg). Jag vill genast säga att de allra flesta sidofält för bloggar och webbplatser finns till höger. Det finns en helt logisk förklaring till detta: hela Internet är så att säga högerhänt.

Varför till höger och varför en?

Den andra outtalade regeln: som regel bör det finnas en sådan sidofält på en blogg. Har du sett en blogg eller webbplats med två eller till och med tre sidofält? Påminner det dig inte om något?

Just det – en helgmässa på kollektivgården Red Drawbar. Och för att vara ärlig så har jag aldrig sett en enda harmonisk, vackert och korrekt designad blogg med mer än 1 sidofält. Om inte, en länk till studion, vi diskuterar det.

Så, sammanfattande ett visst resultat, vill jag indikera detta (åtminstone jag personligen är säker på detta):

• sidofältet ska vara till höger och ensamt. Jag upprepar: inte två, inte tre!
• sidofältet till vänster är ett tecken på "intrång" hos bloggägaren.

Vad ska finnas i sidofältet på en blogg?

På min gratiskurs "Blogga med dina egna händer. Start." Jag nämnde naturligtvis hur huvuddelarna i en blogg bör läggas upp. I det här inlägget kommer jag att ge mer detaljerat material om detta ämne, jag kommer att ange så att säga min vision.

Bredd. Här, återigen, är allt individuellt, och du kan stängsla "trädgården" i vilken riktning som helst, men den minsta bredden på detta fält bör vara 250 px, eller till och med lite mer.

Ett stort antal sidofältsbanners är 250x250 px, 125x125 px, 240x400 px och så vidare. Meningen tror jag är tydlig. Om du tänker framåt måste du nu säkra ditt framtida annonsutrymme om du ska tjäna pengar på bannerannonsering.

Och det är bra om du får ett "gummi"-tema, där du kan ändra bredden när som helst, men om inte? Det är samma sak.

Höjd. Dynamiskt värde för vilken mall som helst. Ju fler inlägg du lägger på den första sidan med meddelanden, desto "längre" kommer din blogg att bli och längden på sidofältet kommer att ändras i enlighet med detta.

Plats för element. En regel gäller här - ju närmare elementet är placerat bloggens header (header), desto mer "värdefullt" bör det vara. Därför finns här som regel de flesta godsakerna från någon blogg (webbplats) - en prenumeration på nyhetsbrev, ett sökformulär eller helt enkelt en av de dyraste reklamplatserna.

Låt mig berätta mer om vad som borde finnas där. Alla kan lägga till en lista själv (och väldigt ofta "upprörande"):

• Sökformuläret (standard och rullar inte), fungerar bättre från Google eller Yandex.
• Färgglad din egen banner för en gratis eller betald produkt som definitivt skulle fungera som en "prenumerationsgenerator", d.v.s. ta med folk till din prenumerationslista.
• Kommentatorfönster. Mycket ofta ser jag det här fönstret längst ner. De säger också att kommentarer är blodet på en blogg. Eller har jag förvirrat något? Och i så fall – varför då ha dyra kommentatorer allra längst ner. Jag förstår inte.
• Populära bloggartiklar. Här räcker det med att placera 4-6 mest populära (kommenterade) artiklar för att ge ytterligare trafik till dem.
• Fönster för sociala medier. Jag har den här funktionen implementerad med hjälp av "Social Carousel" http://makedreamprofits.ru/ Detta fönster är nödvändigt för att koppla dina besökare till dina konton i olika sociala nätverk.
• De två fönstren som jag har placerat i min sidofält är arkivinlägg och rubriker. Enligt idén måste denna funktion implementeras med hjälp av flikar. När jag omarbetar min design kommer jag definitivt att göra det på det här sättet. Det ser snyggt ut och sparar mycket utrymme.

Detta är precis vad du behöver placera i sidofältet på din blogg. Här följer jag också följande regel: höjden på sidofältselementen måste matcha höjden på huvudsidans meddelanden.

Hej kompisar! Som utlovat gjorde jag ett ämne om WordPress sidofält. Det här är en liten guide för att använda och anpassa sidofält på WordPress-webbplatser.

I den här tråden vill jag avslöja en liten hemlighet för alla mallutvecklare: sidofält har alltid varit en viktig del av WordPress-systemet och har förbättrats avsevärt under de senaste åren.

Med hänsyn till den senaste utvecklingen kommer jag att visa dig steg-för-steg-processen för att skapa och använda sidofält för WordPress-teman.

Vad är en WordPress sidofält?

Faktum är att termen "sidebar (sidebar)" kan betyda två helt orelaterade begrepp i WordPress-systemet:

1. Dynamisk sidofält: en behållare för en uppsättning widgets som användaren kan installera via adminpanelen -> Widgets.
2. Sidebar mall: Detta är sidofältet som visas av webbplatsmallen.

I de flesta fall har enkla mallar en dynamisk sidofält som laddar alla placerade widgets från adminpanelen. Denna process kan också ske enligt en annan algoritm, men oftast enligt detta schema. Ändå är det viktigt att förstå att en dynamisk sidofält och en sidofältsmall är två olika saker. Allt är premium, jag arbetar främst med Sidebar-mallen.

Vanligtvis används termen "sidebar" i relation till den dynamiska sidofältet, som kommer att diskuteras i den här artikeln. Jag kommer dock att beröra sidofältsmallen också.

Det som har gjort mig mest besviken när jag bläddrar i många teman är att utvecklarna inte fullt ut utnyttjar de kraftfullaste funktionerna i WordPress-systemet. De flesta teman har bara en sidofält, i bästa fall två. Men trots allt kommer dessa teman att skapa enorma sidor med en uppsättning alternativ som enkelt kan bearbetas med hjälp av widgets, och deras innehåll kan placeras direkt i mallen. Jag föredrar att använda många sidofält i ett tema för att skapa en flexibel, funktionsrik webbplats.

Registrera, lägga till och skapa en WordPress-sidebar

Många teman uppfyller ofta brist på kvalitetsstandarder, så om du är en mallutvecklare, låt oss se till att du tar det här problemet på allvar. Skapa en lämplig dynamik WordPress sidofältär den viktigaste delen av processen, eftersom det du ställer in i den kommer att vara relaterat till alla andra sidofältsfunktioner.

För att skapa en eller flera sidofält måste du registrera dem via en fil funktioner. php Ditt tema, varje tema har sin egen fil som innehåller alla mallinställningar. Att fila funktioner. php Du kan lägga till eller ta bort temainställningar.

Koden nedan visar hur du kan skapa en sidofält i WordPress med hjälp av funktionen register_sidebar(). I det här fallet kommer vi att skapa en sidofält som heter "primär" som kommer att fungera som ett exempel att arbeta med.

"primär", "namn" => __("Primär"), "beskrivning" => __("Sidofältsbeskrivning (synlig i adminpanelen)."), "before_widget" => "

", "after_title" => "

Som du kan se är det en mycket enkel uppgift att registrera en sidofält om du har information om hur du gör det.

Argument för att skapa en dynamisk sidofält dynamic_sidebar()

Fungera register_sidebar() accepterar endast en parameter, den kallas $args och innehåller en uppsättning argument som anger hur sidofältet med dess widgets ska renderas. Tänk sedan på exempel på hur man använder argument manuellt.

ID

Argument id, är förmodligen ett av de viktigaste argumenten att skriva (kolla in exemplet på dåligt skriven kod nedan och se varför du definitivt borde skriva det). WordPress kommer att använda id för att tilldela widgets till en viss sidofält, och du behöver id för att ytterligare fylla sidofältet - sidofältet.

Varje id måste vara unik. WordPress, som standard, kommer att föreskriva det för sidofält-$i(var $ i

//vår widget-id, som endast tilldelas en gång "id" => "primär",

namn

Du kan skriva vilket namn som helst som du tycker bäst representerar ditt WordPress sidofält. Oftast ges sidofält namn som användaren kan avgöra vilka aspekter av ämnet de berör (till exempel vänster eller höger sidofält). Detta argument kan internationaliseras (dvs. lokaliseras för andra språk). Så se till att du skriver rätt textdomän när du förbereder ditt ämne för översättning. Argumentet skrivs som standard som Sidebar $ i(var $ iär ordningsnumret för det skapade sidofältet).

//widgetnamn, i exemplet använder jag Primär som namn på widget-id "name" => "Primär",

beskrivning

Argument beskrivning introducerades först i WordPress 2.9. Detta argument låter dig beskriva din widget, beskrivningen visas i adminpanelen i widgetsektionen. Detta argument är som standard skrivet på en tom sträng. Det kan också internationaliseras (dvs skrivet på kyrilliska eller andra språk).

//beskrivning kommer att vara synlig i widgetsektionen "description" => __("Widget för den vänstra kolumnen på webbplatsen"),

före_widget

Argument före_widget detta är öppningselementet i widgeten som tilldelats sidofältet. Det måste också vara ett element på blocknivå HTML uppmärkning (t.ex. tagg < li > , < p > , < div > etc.). Detta argument har ett par funktioner som du kan skriva till exempel i id="" eller class="": attribut id="" skrivs så här: (%1$s) och attribut class="" Så: (%2$s).

Som standard kommer WordPress att lista dem som ett listobjekt: < li id = "%1$s" > . Jag är inte ett fan av att skapa listobjekt med sidofältswidgetar. Jag använder alltid < div > . Jag är inte ett fan av att skapa listobjekt med sidofältswidgetar. Sista gången jag använder det, för i avsaknad av en widget på webbplatsen kommer du inte att se extra HTML taggar, men vidare kommer vi att överväga hur vi kan bli av med dem.

efter_widget

Argument efter_widget ganska lätt att skapa. Detta är det avslutande elementet för widgeten som tilldelats sidofältet. Du behöver bara stänga elementet som anges för argumentet före_widget. Som standard kommer WordPress att skriva det som < li > .

"after_widget" => "