Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
WPB Cup
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

Så här lägger du till en rullande nyhetsticker i WordPress

Vill du lägga till en rullande nyhetsticker på din WordPress site?

TV-nätverk använder ofta nyhetstickare för att lyfta fram viktiga stories. Detta är ett bra sätt att få besökarens uppmärksamhet, så du kanske vill add to en new ticker till din website och sedan lyfta fram specialerbjudanden, populära posts och annat viktigt content.

I den här artikeln visar vi dig hur du lägger till en rullande nyhetsticker i WordPress.

How to Add a Scrolling News Ticker in WordPress

Vad är en rullande nyhetsticker?

En nyhetsticker är en enkel textrad som rullar kontinuerligt över vyn. Den visar vanligtvis aktuella objekt, sportresultat, finansiell information och valutainformation i realtid samt väderinformation.

Detta liknar hur du kan använda en sticky flytande footer bar.

Tickers är ett bra sätt att displaya små snippor av information på ett iögonfallande sätt. Eftersom innehållet alltid rullar kan du också använda tickers för att visa mycket information på ett begränsat utrymme.

Du kan till exempel använda en nyhetsticker för att displayed your best utförd posts, tillkännage en kommande försäljning eller dela annan användbar information.

Med detta sagt, låt oss titta på hur du add to en rullande nyhetsticker till din WordPress blogg eller website.

Så här addar du en rullande nyhetsticker i WordPress

Det bästa sättet att add to en rullande nyhetsticker till din website är genom att använda Ditty, ett av de bästa WordPress tillägg för nyheter. Detta plugin allow you to add moving, scrolling, and slides content to your website and then change the animation’s direction, spacing, speed, and styling.

Det första du behöver göra är att installera och aktivera Ditty plugin. För mer detaljer, se vår Step-by-Step guide om hur du installerar ett plugin för WordPress.

Efter aktivering måste du gå till Ditty ” Add New i WordPress dashboard och sedan klicka på knappen ”Add Default”.

Adding a ticker to your WordPress website

Du kan nu skapa det första objektet i tickern. I boxen ”Content” skriver du helt enkelt in den text som du vill visa på den rullande tickern.

Här kan du göra ett tillkännagivande eller dela med dig av användbar information, på samma sätt som i en banner på en website. Du kan till exempel informera kunderna om en tidsinställd rea eller senaste inlägg.

Adding content to an online ticker

You can also add links to the news item so that people can easily visit the page or post utvalt inlägg i tickern.

Det gör du genom att add to en URL i fältet ”Link”.

Adding links to a website ticker

You can also add to a link title, mark the URL as nofollow, and more.

För att få ut mesta möjliga av tickern kan du lägga till flera olika objekt genom att klicka på knappen ”Update Item Settings”.

Adding a scrolling news ticker to WordPress

Preview uppdateras nu och visar det objekt som you just har skapat.

För att gå vidare och lägga till ett annat objekt i tickern klickar du på knappen ”Add Item”.

Adding items to a scrolling news ticker

Du kan nu clicka på ”Add Standard” och skapa objektet genom att följa processen som beskrivs ovan.

Upprepa helt enkelt dessa steg för att add to fler objekt till tickern.

När du är nöjd med dina objekt kanske du vill ändra ordern i vilken de visas i tickern. För att göra det tar du bara tag i objektet du vill ändra och drag and dropar det till en new position.

Changing the order of ticker items in a scrolling newsfeed

Som standard visar Ditty dina objekt i en lista.

Eftersom du vill skapa en rullande ticker klickar du på tabben ”Display”.

Creating an animated ticker in WordPress

På den här vyn klickar du på länken ”Change Type”.

I popupen som visas väljer du ”Ticker” och klickar sedan på ”Update Type”.

How to create a scrolling ticker in WordPress

Du kan nu ändra hur tickern ser ut och fungerar på din WordPress website.

Detta inkluderar att ändra rullningens riktning, hastighet och avstånd mellan tickerobjekten.

Customizing an animated ticker

You can also choose between different styles for the ticker container, items, titles, and more. De flesta av dessa Settings är självförklarande, så det är värt att gå igenom dem för att se vilka ändringar du vill göra.

När du är nöjd med hur tickern är konfigurerad, clickar du på knappen ”Save Ditty”.

Saving the ticker settings in WordPress

Efter det är du redo att add to tickern till din site med hjälp av en shortcode. För att få denna shortcode, gå vidare och klicka på tabben ”Settings”.

Kopiera nu värdet i fältet ”Shortcode”.

Adding a ticker to a website using shortcode

När det är gjort kan du add shortcoden till valfri page, post eller widget-ready area. För mer information om hur du placerar shortcoden, vänligen se vår guide om hur du lägger till en shortcode.

När du har gjort det är det bara att updating eller publicera dina ändringar för att göra tickern live på din WordPress website.

News Ticker Preview

Vi hoppas att denna tutorial hjälpte dig att lära dig hur du lägger till en rullande nyhetsticker i WordPress. Du kanske också vill lära dig hur du markerar new posts för återkommande besökare eller se vårt expertval av de bästa tricken för sidebar i WordPress för att få maximalt resultat.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

Avslöjande: Vårt innehåll stöds av våra läsare. Det innebär att om du klickar på några av våra länkar, kan vi tjäna en provision. Se hur WPBeginner finansieras, varför det är viktigt, och hur du kan stödja oss. Här är vår editoriala process.

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

Den ultimata WordPress-verktygslådan

Få GRATIS tillgång till vår verktygslåda - en samling WordPress-relaterade produkter och resurser som varje professionell användare bör ha!

Reader Interactions

16 kommentarerLämna ett svar

  1. Syed Balkhi says

    Hey WPBeginner readers,
    Did you know you can win exciting prizes by commenting on WPBeginner?
    Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
    You can get more details about the contest from here.
    Start sharing your thoughts below to stand a chance to win!

    • WPBeginner Support says

      While the ticker would not transmit the information to your other site, you can certainly add the same information in the ticker.

      Administratör

  2. karbhari says

    How do i add the Latest News: title to the scrolling news, after header in main page it shows on my site.

  3. Anna Sue says

    Where do you enter the text for your ticker? My install doesn’t show some of the items you have in your screenshots.

  4. Anna Sue says

    I this may be the ticker I want but, as in many online videos about plugins, you talked and moved so fast I could get the instructions.

  5. felix says

    How do i add the Latest News: title to the scrolling news, it shows on my site, but i didnt see where to add if its lastest news or latest update etc

  6. hosam abdallah says

    very good plugin but i have aquestion
    i use artisteer to make my themes can you tell me where can i add php function to widget
    in this or from where can i add to my themes

  7. Abdulmumin says

    Hello, Please how can I add the direct function, kindly provide the ste by step instruction in adding the direct funtction.

    I added the shortcode in my about page and it worked but i added it on my home page but it didnt work…..kindly advice

    • WPBeginner Support says

      Simply copy the Direct function as shown in the last screenshot of the article and paste in your theme’s home.php or header.php. Paste it at the location where you would like your news ticker to appear.

      Administratör

  8. Sujani says

    hey,
    thanks for giving the instructions clearly.. i had a a question where should we put the shortcode and direct function?
    do we place it in the post/page?

    Thanks,
    Sujani

  9. Peter Johnson says

    It seems a great theme, as I am not a PHP developer but I want to use this theme and integrate this theme on my wordpress blog. I just want you to describe ho can I use this theme in my Blog so my latest news can be shown on top of my menu or below my main menu like a slide shown on Television. Please I need a procedure.

    Thanks

Lämna ett svar

Tack för att du väljer att lämna en kommentar. Tänk på att alla kommentarer modereras enligt våra policy för kommentarer, och din e-postadress kommer INTE att publiceras. Vänligen använd INTE nyckelord i namnfältet. Låt oss ha en personlig och meningsfull konversation.