EN
Sökande...

Hur använder man Pixpa-textredigeraren?

När du redigerar innehåll är det viktigt att lära dig hur du använder text/WYSIWYG-redigeraren (det du ser är vad du får). Denna textredigerare låter dig redigera, ändra och lägga till innehåll på dina webbsidor (kontaktformulär, kalender, gästbok), blogginlägg och omslagsbanners utan att ha kunskap om HTML.

När du arbetar med Pixpa textredigerare, tryck ENTER (Windows) eller RETURN (mac) för att skapa ett nytt stycke, för att infoga en ny rad utan att tvinga fram ett nytt stycke, tryck och håll ned SHIFT och tryck sedan på enter eller retur.

De flesta av redaktörens funktioner kommer att träda i kraft i samma ögonblick som du klicka på knappen/ikonen. I andra fall kommer ett klick på ikonen att skapa en liten rullgardinsmeny med ytterligare alternativ.

När du lägger till stil till din text kan du antingen klicka på redigeringsalternativet och börja skriva för att få det valda resultatet eller skriva din text, markera den och sedan klicka på redigeringsalternativet för att lägga till den i den markerade texten.

Alternativen som förklaras är: 

  1. Format – Ändra teckensnitt
  2. Align – Justering av texten
  3. Fet / Kursiv / Genomstruken / Understrykning
  4. Lista – Beställd / Oordnad
  5. Bild – Lägg till en bild
  6. Video – Lägg till en video
  7. Tabell – Lägg till en tabell
  8. Länk – Lägg till en länk till din text
  9. Textfärg – Ändra färgen på text
  10. Klipp – Lägg till CTA-knappar
  11. Widget – Lägg till en anpassad kod
  12. Linje – Lägg till en rad
  13. Fullskärmsläge
  14. HTML-kodvy

1. Format – Ändra teckensnittsstil

Du kan använda fyra olika typer teckensnittsstilar på din webbplats (i taget) som skulle specificeras i Design avsnitt. Detta är en vanlig designstil som används på hela webbplatsen.


Alla teckensnittsstilar anges i design avsnitt. Du kan också klicka på Hantera teckensnitt, vilket är det sista alternativet i rullgardinsmenyn när du klickar på text knapp. Du kan nu se och ställa in följande typsnitt och redigera typsnittsstil, storlek, färg, vikt, radhöjd och bokstavsavstånd:

  • Rubrik 1
  • Rubrik 2
  • Rubrik 3
  • Rubrik 4
  • Stycketext (normal, liten och stor)

Här är en skärmdump av stilen Rubrik 1. Du kan redigera de andra rubrikernas stycketeckensnitt här också.


Notera: "Code" och "Quote" har standardutformning.

  • Koda: Detta används för att definiera en bit datorkod. Innehållet inuti visas i webbläsarens standardtypsnitt för monospace.
  • Offert: Detta är samma som H3 tillsammans med en blockquote-tagg.

När du har angett teckensnittsstilen i designsektionen kan du effektivt använda dem på hela webbplatsen. Markera bara texten och använd formateringen. Systemet kommer automatiskt att tillämpa teckensnittens färg, storlek och vikt för den specifika stilen på den valda texten. Du kan recensera detsamma på hemsidan.

Anmärkningar: Typsnittsstil, vikt och färg kommer endast att synas på webbplatsen och INTE i studion.

2. Align – Justering av texten

Du kan justera din text som vänster, höger, centrerad och justerad. Markera texten och välj justering från rullgardinsmenyn.

3. Fet / Kursiv / Genomstruken / Understrykning

  • Fet – Markerad text blir fet när du klickar på den. I HTML använder detta en tagg.
  • Kursiv – Markerad text blir kursiv när du klickar på den. I HTML använder detta
  • strykning – Markerad text markeras som borttagen när du klickar på den. I HTML använder detta märka.
  • stryka – Markerad text kommer att bli understruken när du klickar på den. I HTML använder detta taggen.

4. Lista – Beställd / Oordnad

Du kan enkelt konvertera din text till listor med indrag för att organisera dem.

  • oordnad lista – Markerad text kommer att formateras som en punktlista. I HTML använder detta en uppsättning av och taggar.
  • ordnad lista – Markerad text kommer att formateras som en numrerad lista. I HTML använder detta en uppsättning av och taggar.
  • Överdriven – Ett markerat textområde kommer att tas bort.
  • strecksatsen – Ett markerat textområde dras in.

5. Bild – Lägg till en bild

Du kan lägga till flera bilder genom att klicka på den. Genom att klicka på den här knappen öppnas ett litet modalt fönster där du antingen kan dra eller välja din bild från ditt system. I HTML är taggen som används .

Du kan också ändra storlek på din bild genom att dra och släppa från den högra nedre blå ikonen på just den bilden.

Redaktören låter dig också lägga till bildtitel, bildtext och länk till den uppladdade bilden. Klicka på valfri bild så ser du alternativet Redigera (1), Radera (2) och Ändra storlek (3).

Efter att ha klickat på Redigera, kommer du att se ett popup-fönster där du kan ange:

  1. Titel – Det här skulle vara alt-tagg av just den bilden.
  2. Bildtext – För att visa bildtexten tillsammans med bilden på live-webbplatsen.
  3. Placera – Välj justering av bilden (vänster, mitten, höger eller ingen).
  4. Länk – Lägg till en länk till bilden.
  5. Öppna i ny flik – Markera den här kryssrutan om du vill öppna bildlänken på en ny flik.
  6. Save – Spara dina ändringar
  7. Radera – Radera bilden
  8. Byt ut bilden genom att släppa en ny bild på själva miniatyren.

Idealisk bildstorlek för textredigerare för blogginlägg är 1500px bredd x valfri höjd. Detta är den föredragna storleken för alla blogglayouter. Webbplatsbildfilformat som stöds är JPG, JPEG, PNG och GIF. Om du laddar upp bilder i större storlek, vi förminska dem till 1500 pixlars bredd. 

6. Video – Lägg till en video

Du kan lägga till dina YouTube/Vimeo-videor här. Genom att klicka på den här knappen öppnas ett litet modalt fönster där du kan ange din Youtube/Vimeo-video-URL eller bädda in kod.

Dricks: Du kan också placera YouTube URL direkt i textredigeraren. Systemet drar automatiskt videoskärmdumpen.  

7. Tabell – Lägg till en tabell

Klicka på tabellikonen (7) för att lägga till en tabell med N antal rader. Du kan strukturera ditt innehåll i rader och kolumner.

 

8. Länk – Lägg till en länk till din text

Editorn låter dig infoga en länk till vilken text som helst. Du kan ansluta dina befintliga webbsidor eller någon annan webbplats/blogg/PDF-fil etc.

Om du markerar text och klickar på den här knappen öppnas ett litet modalt fönster där du kan ange måladressen, välja om du vill öppna i ett nytt fönster eller inte, eller välja att länka till en annan sida på sin egen webbplats. I HTML är taggen som används Länktext

Vänligen notera:

  • För att länka till en extern webbplats som ligger utanför din Pixpa-webbplats, skriv in http://följt av till exempel webbadressen http://www.example.com.
  • För att länka till en galleri- eller butikskategori eller sida på din webbplats anger du till exempel URL-sluggen /gallery
  • För att skapa en länk som öppnar en skrivbordsklient för e-post, skriv in mailto: följt av till exempel e-postadressen mailto:example@example.com.
  • För att skapa en länk som ringer ett telefonsamtal, skriv in tel:följt av till exempel telefonnumret med landskoden tel:+0-123-456-7890
  • För att skapa en länk som öppnar Whatsapp, skriv in https://wa.me/<number> där den <number> är ett fullständigt telefonnummer i internationellt format. Utelämna eventuella nollor, parenteser eller bindestreck när du lägger till telefonnumret i internationellt format. Till exempel: Använd https://wa.me/15551234567 istället https://wa.me/+001-(555)1234567. Veta mer.
  • För att länka till din PDF eller annan fil som laddats upp i filsektionen, skriv in den kopierade länken här. Veta mer.

9. Textfärg – Ändra färgen på texten

Som standard kommer systemet att tillämpa teckensnittsfärgen som anges i design avsnitt. Du kan dock åsidosätta global färg med det här verktyget. Välj texten och klicka på färgikonen, en standardpalett med färger kommer att dyka upp som du kan välja mellan.

Notera: Du kan ange vilken annan anpassad färg som helst som inte är tillgänglig i färgpaletten från HTML-kodvyn. Scrolla ner till punkt 12 för att veta mer.

10. Klipp – Lägg till CTA-knappar

Redaktören låter dig också lägga till CTA-knappar – fyrkantiga eller rundade för att länka till valfri sida/galleri/webbplats/pdf etc. Du kan anpassa dess storlek och färg från HTML-kodvyn. Scrolla ner till punkt 12 för att veta mer.

Genom att klicka på denna ikon öppnas ett litet modalt fönster där du kan välja CTA-knappen.

11. Widget – Lägg till en anpassad kod

Editorn låter dig lägga till valfri anpassad kod också, t.ex. Google Maps inbäddningskod, Soundcloud inbäddningskod, Tweet post inbäddningskod, etc. I huvudsak kan vilken inbäddningskod som helst läggas till i redigeraren med hjälp av widgetikonen.

Genom att klicka på den här ikonen öppnas ett litet modalt fönster där du kan klistra in din inbäddningskod.

12. Linje – Lägg till en rad

Editorn låter dig lägga till en horisontell linje.

Genom att klicka på denna ikon läggs en rad till där markören är placerad.

13. Helskärmsläge

Editorn låter dig växla till helskärmsläge. Det skulle vara till stor hjälp om du organiserar ditt långa blogginlägg eller skriver en lång artikel.

14. HTML-kodvy

Editor-fönstret kan fungera som en Visual Editor (WYSIWYG) eller som en HTML-redigerare.

Du kan dock byta till HTML-redigerare genom att klicka på den. Du kan ändra vad som helst från kodvyn om du vet hur du gör det eller så kan du också pinga Pixpa supportteam om du behöver hjälp.

Dricks: Med hjälp av HTML-kodvy kan du lägga till vilken typ av inbäddningskod som helst i ditt blogginlägg.  

Taggade:

Hittar du inte det du letar efter?

Ta kontakt med en Pixpa-expert.

Kontakta oss