Undrar du hur du kan markera nya posts för återkommande besökare i WordPress?
Att visa upp de posts som nyligen publicerats på din website är ett sätt att välkomna dina lojala läsare, hålla dem updating och se till att de inte missar ditt senaste content.
I den här Step-by-Step-guiden visar vi hur du markerar nya posts för återkommande besökare i WordPress.
Varför markera nya posts på din WordPress site?
Genom att markera nya posts på din site i WordPress kan återkommande besökare enkelt upptäcka ditt nya content. På så sätt går de inte miste om ny information eller updates som du har lagt till på din blogg.
Märkning av new posts förbättrar upplevelsen för användarna på din WordPress website. När en återkommande visitor kommer till din website kan de enkelt se vilka posts de inte har läst än, vilket sparar mycket tid och ökar antalet sidvisningar på your website.
En bra användarupplevelse på din site håller inte ej bara besökarna nöjda utan hjälper också till med sökmotorsoptimeringen för WordPress. När din site är användarvänlig förbättras rankingen i search engine och sannolikheten ökar för att visitorerna hittar ditt content.
Med detta i åtanke, låt oss se hur du kan markera nya posts för återkommande besökare i WordPress.
Vi kommer att visa dig två metoder: en med en WordPress plugin och den andra med kod. Du kan hoppa till en specifik metod med hjälp av snabblänkarna under:
Metod 1: Markera nya WordPress-poster med ett WordPress-plugin
Denna första metod använder pluginet Mark New Posts. Vi rekommenderar det för Beginner bloggare eftersom det är mycket enkelt. Detta plugin kommer att add en etikett för att visa vilka blogginlägg dina besökare inte har sett ännu.
Först och främst måste du installera och aktivera pluginet Mark New Posts. Om du behöver vägledning kan du läsa vår Step-by-Step guide om hur du installerar ett plugin för WordPress.
Därefter går du till Settings ” Mark New Posts från WordPress admin area. You will now see the plugin’s settings page.
Det du vill göra nu är att selecta var etiketten ”New” ska visas. You can select After post title, Before post title, or Before and after post title.
Vi tycker att om du lägger till etiketten efter rubriken på posten kommer det att gilla en notification och fånga användarnas uppmärksamhet mest, så det är vad vi har valt.
Därefter måste du välja hur markören gillar att se ut i inställningen Markörtyp. Bland alternativen finns ”New” text, ”New” text legacy, Orange cirkel, Flagga, Bild eller Ingen.
Se till att utforska varje alternativ för att se vilket som passar bäst med designen av din website.
En annan inställning som du kan konfigurera är bakgrundsfärgen för titeln på det nya inlägget. Om du aktiverar detta, när en läsare besöker ett nytt inlägg, kommer de att se att postens titel section har en bakgrundsfärg. Vi tyckte inte att den här inställningen var nödvändig, så vi inaktiverade den.
I inställningen ”Betrakta ett inlägg som läst” kan du välja när etiketten för nya inlägg ska stängas av: efter att det har öppnats, efter att det har publicerats i listan eller efter att någon page på bloggen har öppnats.
Vi föreslår att du använder ”efter att det öppnades”. Det innebär att om en visitor inte har läst flera posts och öppnar en, så försvinner inte etiketten new post för de andra artiklarna.
Därefter kan du selecta hur många dagar inlägget ska vara markerat som nytt, visa alla befintliga inlägg som nya för nya besökare och inaktivera den nya etiketten för custom post types.
De två sista Settings är ganska avancerade.
En är att ”Allow outside the post list”, vilket innebär att du kan markera posts utanför slingan, gillar i widget-klara sidebar areas. Var försiktig med att aktivera den här inställningen, eftersom det kan skapa oönskade WordPress error.
Den andra är ”Använd JavaScript för att visa markörer”, som endast rekommenderas om pluginet inte är kompatibelt med temat eller andra tillägg som används på din blogg. I de flesta fall kommer du att vilja ha den här inställningen inaktiverad.
När du är klar med att konfigurera plugin-inställningarna klickar du bara på ”Save”.
Och nu är det klart! Gå vidare och besök din website i inkognitoläge för att se om de nya etiketterna för senaste inlägg är live.
Så här gillar vi det på vår demo website:
Metod 2: Markera nya inlägg genom att lägga till anpassad kod
Är du missnöjd med de nya alternativen för inläggsetiketter som ges av föregående inlägg? Om så är fallet kan du markera nya posts med hjälp av custom code istället.
För Beginnare kan denna metod verka skrämmande. Men oroa dig inte eftersom vi kommer att använda WPCode plugin för att säkert insert code snippets i WordPress utan att bryta din website.
WPCode gör det också enkelt att hantera flera anpassade code snippets, vilket kommer att vara praktiskt i vårt fall eftersom vi kommer att använda mer än en.
Obs: Även om det finns en gratis version av WPCode, kommer vi att använda WPCode Pro eftersom det tillåter dig att infoga code snippets på rätt platser för denna tutorial.
Det första du behöver göra är att installera WPCode i WordPress. För installationsinstruktioner, gå vidare och kontrollera vår artikel om hur du installerar ett WordPress plugin.
Gå sedan till Code Snippets ” + Add Snippet från din WordPress dashboard. Efter det väljer du ”Add Your Custom Code (New Snippet)” och klickar på knappen ”Use snippet”.
Låt oss nu add to en titel till ditt code snippet så att det är lättare att hitta det senare om det behövs. För detta kan du namnge det något som ”WordPress Last Visit Rubrik Modifier.
Välj sedan ”PHP Snippet” i dropdown för Code Type.
Efter det kan du kopiera och paste code snippet under:
// Define a function to modify post titles based on the last visit
function wpb_lastvisit_the_title($title, $id) {
// Check if not in the loop, a singular page, or a page post type; if true, return the original title
if (!in_the_loop() || is_singular() || get_post_type($id) == 'page') return $title;
// Check if no 'lastvisit' cookie is set or if it is empty; if true, set the cookie with the current timestamp
if (!isset($_COOKIE['lastvisit']) || $_COOKIE['lastvisit'] == '') {
$current = current_time('timestamp', 1);
setcookie('lastvisit', $current, time() + 60 * 60 * 24 * 7, COOKIEPATH, COOKIE_DOMAIN);
}
// Retrieve the 'lastvisit' cookie value
$lastvisit = $_COOKIE['lastvisit'];
// Get the publish date of the post (in Unix timestamp format)
$publish_date = get_post_time('U', true, $id);
// If the post was published after the last visit, append a new span to the title
if ($publish_date > $lastvisit) $title .= '<span class="new-article">New</span>';
// Return the modified or original title
return $title;
}
// Add a filter to apply the 'wpb_lastvisit_the_title' function to 'the_title' hook with priority 10 and 2 parameters
add_filter('the_title', 'wpb_lastvisit_the_title', 10, 2);
Vad det här snippet gör är att ändra rubrikerna på WordPress-poster baserat på en användares senaste besök.
Det kontrollerar om sidan är ett blogginlägg eller ej, och om inte, kommer den att visa originaltiteln som den är. Men om det är ett blogginlägg kommer titeln att ändras.
Sedan ser snippet till att cookien för senaste besök
finns. Om den inte gör det skapar koden den och ställer in den på aktuell tid. Funktionen jämför sedan denna lastvisit-tid
med postens publiceringsdatum och lägger till en ”New”-etikett i rubriken om inlägget är nyare än det senaste besöket.
När du har infogat code snippet rullar du bara ner och väljer ”Auto Insert” för Insert Method.
Utöver det ska du se till att välja ”Front-end only” för Location. Detta innebär att koden endast kommer att run på den del av din WordPress blogg som besökarna interagerar med och ej i din adminpanel eller på andra platser.
När du har gjort det kan du göra koden ”aktiv” och clicka på ”Save Snippet”.
Upprepa nu steget för att lägga till ett nytt anpassat code snippet. Den här gången kommer koden att utforma etiketten ”Inga annonser” som läggs till i titlarna på de senaste inläggen baserat på användarens senaste besök.
Så du kan namnge det något som ”Post Type New Label Style” och Code Type bör vara ”CSS Snippet.
Du kan sedan copy and paste följande kodrader till boxen Code Preview:
/* CSS to style the "New" label in blog post titles */
.new-article {
background-color: #4CAF50; /* Green background color */
color: #ffffff; /* White text color */
padding: 2px 5px; /* Padding around the label */
margin-left: 5px; /* Adjust the margin to your preference */
border-radius: 3px; /* Rounded corners for the label */
font-size: 12px; /* Adjust the font size to your preference */
}
Detta code snippet i huvudsak customize ’New’ post etikett med hjälp av en custom bakgrundsfärg, textfärg, padding, marginal, border radius, och font storlek.
Känn dig gratis att justera dessa element till dina alternativ när du går vidare. Se bara till att använda hex-färgkoder eller RGB-värden för bakgrundsfärger och textfärger.
I sektionen Infogaren väljer du ”Site Wide Header” som Location. Efter det gör du koden ”Aktiv” och klickar på ”Save Snippet”.
Och så är det klart! För att se om koden fungerar kan du publicera ett nytt blogginlägg och viewa inlägg et i inkognitoläge i mobilen eller på datorn.
Om koden är framgångsrik bör du se en ”New”-etikett bredvid titlarna på dina senaste inlägg.
Learn More Sätt att Optimera Din WordPress Blogg
Förutom att lyfta fram nya inlägg för återkommande besökare finns det andra sätt du kan göra för att förbättra din blogg och få folk att stanna kvar längre på din website.
Du kan till exempel visa posts som är relaterade till det som besökaren för närvarande läser. På så sätt kan du hålla dem engagerade genom att presentera content som stämmer överens med deras intressen.
Eller så kan du skapa en sticky flytande flytande footer bar för att genomföra email addresses eller främja specialerbjudanden. Detta fält förblir synligt när besökarna rullar ner på sidan. You kan använda den för att konstant påminna dem om att prenumerera eller utnyttja ditt erbjudande, vilket ökar konverteringen.
Du kanske också vill add to en font resizer för tillgänglighetsändamål. Detta allow visitors to adjust the font size on your website to their preference, making it easier for them to read your content.
Om du har mycket blogginnehåll kanske du vill skapa custom pages som visar blogginlägg om de har ett specifikt custom field.
Låt oss säga att you har ett custom field för ”Recipe Difficulty”. Du kan skapa en page som visar alla blogginlägg som är taggade med ”Recept” och som också har customize-värdet ”Lätt”. På så sätt kan besökare som letar efter enkla recept hitta dem all på ett ställe.
Här är andra tips som du kan kontrollera för att ytterligare optimera din WordPress blogg:
- Så här displayed du relativa datum i WordPress
- Så här skapar du ett customize rullningsfält i WordPress
- Hur man visar excerpt av post i WordPress Themes
- Sätt att skapa en mobilvänlig site med WordPress (experttips)
- Hur man markerar text i WordPress (Beginner’s Guide)
Vi hoppas att den här artikeln hjälpte dig att lära dig hur du markerar new posts för återkommande besökare i WordPress. Du kanske också vill kontrollera våra expertval av de bästa plugins för drag and drop page builders i WordPress och vår ultimata guide om hur du redigerar en WordPress website.
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.
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!
keramzyt says
Is any way to set this cookie and functionality to different subpages on website?
Peter says
Hi
I use WP for a static website and show posts in a sidebar using the Recent Posts widget.
I would like visitors to the site to be able to see new posts by highlighting them in some way in the sidebar e.g. showing ”New” against the title of the post.
Is there any plugin that will support this? The Mark New Posts widget only shows that the item is new once you have opened the post from the sidebar.
Many thanks
Peter
محمود says
it didn’t work in my site…
please help.
S says
Forgot to mention, as mentioned above, most websites have more than one theme per post/page, so this may not work in that instance. Have a wonderful day.
S says
Thank you for all your help. However, this needs to be in a short video and explained in slow detail. This is complicated and for developers that are used to coding, not for the average joe building a website. I always appreciate your emails so much
WPBeginner Support says
Please use the first method which uses a plugin.
Administratör
simpson says
Hello
this tutorial not works for me can u help me?
sam says
Hi
This is awesome but doesn’t work for me on wordpress multisite
Thanks
Sam says
This does not work for multisite network. Can you please advise. I appreciate your help by adding a tutorial for multisite.
Thanks
mthcsn says
Great stuff! Thanks!
Although, I think the cookie is expiring rather fast. I think it was meant to be ’time()+(60*60*24*7)’ so it expires after a week. Otherwise, it expires only after slightly less than 3 hours.
Danny van Kooten says
Great idea – I turned this into a quick plugin so it’s even easier to integrate. It’s available from the WP.org repository: http://wordpress.org/plugins/highlight-new-posts/
Suggestions are very welcome.
simpson says
pls update plugin
Dennis Does Cricket says
Can you please show pics of what the intended outcome is?