TechBlogSD - Allt för WordPress- och WEB -utveckling
WEB- och WordPress - instruktioner, nyheter, recensioner av teman och plugins

Gör navigationsmenyn på översta nivån inte klickbar i Weebly

1

Weebly erbjuder en enkel plattform för byggare av webbplatser som kanske inte är användbar eftersom den är för de flesta användare. Att till exempel ordna sidor i önskad ordning är en smärta i Weebly och att inte göra att navigationsmenyn på översta nivån är klickbar är inte standard som standard. Så länge Weebly tillåter att ändra käll -CSS kan vi göra sådana saker möjliga genom att lägga till enkel CSS -kod i huvud -CSS -filen “main_style.css". I den här artikeln kommer vi att diskutera hur man gör att navigationsmenyn på högsta nivå inte är klickbar på Weebly -webbplatsen .

Navigationsstruktur på högsta nivå

Innan du fortsätter är det nödvändigt att förstå grundstrukturen i Weebly -navigationsmenyn. Högerklicka på menyn på din publicerade webbplats och välj alternativet "Inspektera" eller "Inspektera element" för att öppna utvecklarkonsolen i din webbläsare. När du flyttar musen över varje navigeringsmeny på toppnivå kan du se motsvarande CSS -klasser. Varje navigeringsmeny på toppnivå identifieras med en CSS-klass som ".wsite-nav-1", ".wsite-nav-2 ″,". Wsite-nav-3 ″, etc. där 1 är "Hoe" -sidan i allmänhet .

Gör navigationsmenyn på översta nivån inte klickbar i Weebly

Hitta CSS -klass för Weebly Top Navigation Menu

Siffrorna kan ändras baserat på ditt tema och anteckna CSS -klassen i navigeringsmenyn som du vill att den inte ska vara klickbar. Antag att du vill göra den andra navigeringsmenyn inte klickbar och motsvarande CSS-klass är ".wsite-nav-2".

Navigera nu till Weebly -kodredigeraren under "Tema> Redigera HTML / CSS> Tillgångar> main_style.css" och lägg till följande CSS -kod.

.wsite-nav-2 { pointer-events: none; }

Spara ändringarna och publicera din webbplats för att se att den andra översta navigeringsmenyn inte är klickbar och markören kommer inte att ändras till en hands on hover. Om du vill göra markören till handen men menyn inte ska vara klickbar kan du ändra koden ovan som nedan:

.wsite-nav-2 a:active { pointer-events: none; }

På samma sätt kan du göra alla navigeringsmenyer på toppnivå inte klickbara genom att lägga till motsvarande CSS -klasser.

Weebly har olika navigeringsstruktur på mobila webbplatser och genom att klicka på toppmenyn visas listan över menyalternativ inklusive toppmenyn igen. Detta gör det möjligt att öppna den översta menylänken om den har ett innehåll, men i vårt fall bör vi ta bort den här länken från listan. Lägg därför till följande CSS i din "main.less" -fil:

.wsite-menu-master-item { display: none !important; }

Efter att ha lagt till alla CSS -koder kan det se ut ungefär så här:

Gör navigationsmenyn på översta nivån inte klickbar i Weebly

Ändra CSS i Weebly

Spara ändringarna och publicera din webbplats.

Döljer toppnavigeringssidor från sökmotorer och användare

  • Dölj de översta navigeringssidorna från sökmotorer som förhindrar sökmotorer att genomsöka de tomma sidorna. Du kan göra detta genom att markera alternativet "Dölj den här sidan från sökmotorer" under "Avancerade" inställningar för varje toppnivåsidor.
  • Kom ihåg att användare fortfarande kan komma åt sidorna genom att direkt ange webbadressen i webbläsarens adressfält. Helst skulle inställning av 301 -omdirigeringar lösa detta problem, tyvärr tillåter Weebly inte att ställa in omdirigeringar för livesidor. Därför kan du inte hindra användarna från att komma åt sidorna via adressfältet.

Inspelningskälla: webnots.com
Leave A Reply

Denna webbplats använder cookies för att förbättra din upplevelse. Vi antar att du är ok med detta, men du kan välja bort det om du vill. Jag accepterar Fler detaljer