How to redirect to a tag on tumblr

New Page

Organization with labels

Navigation

  • Label Pages
    • Tumblr-wide tag pages
    • Tag pages in the blog
  • Tags in URLs
  • Use pages to organize tags

Tagging your posts is a great way to show your content to the communities you want to reach, but it’s also a great tool for organizing, collecting, and displaying your posts using tag pages in the blog.

Tag Pages

Tumblr-wide tag pages

A tag page is a dashboard-style view of posts with a given tag.

You can bookmark a tag page by following it, making it easier to come back to it later. Following a tag will also inject some posts from that tag to your dashboard, but you can disable this option with the Include followed tag posts toggle in your dashboard settings.

There are several ways to access a tags page:

  • Click on the beacon on your dashboard.
  • Add the tag name to the end of tumblr.com/tagged in your browser’s address bar.
  • Start typing the tag, then click the Go to #___ suggestion .

Tumblr's main search bar with the word dogs being typed. Drop-down suggestions show #dogs, which is highlighted.

Are your original posts not showing up in recent results? See our article on appearing in search results .

Tag pages in the blog

Clicking (or tapping) on ​​a tag on your own blog will take you to your blog’s tag page for that tag.

You can also link to posts with a tag, by adding /tagged /tag to your blog URL. For instance:

http://staff.tumblr.com/tagged/features http://staff.tumblr.com/tagged/events _ _

These links will only display the 200 most recent posts with this tag in reverse chronological order (latest posts at the top).

To display posts in chronological order (older posts on top), add /chrono to the end of the tag URL (ie http://staff.tumblr.com/tagged/features /chrono ).

Some themes won’t show tags, but they will still appear in the dashboard and be searchable across Tumblr (unless you’ve hidden it from search results ).

Tags in URLs

For some characters to work properly in URLs, they need special handling. For example, if your tag has multiple words, your links should have %20 instead of the space. If your tag has a + sign, you’ll need to use %2B instead. Here are some examples of what these would look like:

Your tag How the URL will look
tumblr tuesday yourblog.tumblr.com/tagged/tumblr%20tuesday
tumblr-tuesday yourblog.tumblr.com/tagged/tumblr-tuesday
tumblr+tuesday yourblog.tumblr.com/tagged/tumblr%2Btuesday
tumblr_tuesday yourblog.tumblr.com/tagged/tumblr_tuesday

For this reason, in October 2021, we’ve announced a new toggle to substantially improve the accuracy of those results. If you’re having trouble with your URLs not working properly, try toggling the Use better tagged and search URL decoding option from your blog customize menu (remember to hit Save after toggling it on):

A sidebar parameter /customize. Text reads URL handling, uses better tag and search URL decoding, with toggle animation enabled.

Using that toggle does not require changes to the tags on your posts (past or future ones). It will only change the URLs of your tag pages, so keep this in mind if you have a master list of your blog’s tag pages.

With that toggle disabled, a blog’s tagged URL like https://staff.tumblr.com/tagged/tumblr-tuesday would turn tumblr-tuesday into tumblr tuesday, and you’d see posts with that tag (same with search URLs).

If you have that toggle enabled, that https://staff.tumblr.com/tagged/tumblr-tuesday URL will be decoded as tumblr-tuesday instead. If you want to link to the tumblr tuesday tag on your blog, you’ll have to use tumblr%20tuesday in the URL. This means that if you use certain special characters in your tags, you’ll now properly be able to link to them.

Using Pages to Organize With Tags

You can create Link Pages to offer show links to posts with specific tags within your blog.

The image shows the header from staff.tumblr.com. One of the links, Features, is highlighted. The URL of this link ends with /tagged/features

  1. Click Add a page at the bottom of the sidebar on the Pages section of your blog customize menu.
  2. Select Link from the dropdown menu, but note that in order to prevent spam and if your account is new, you won’t see this option. This feature will be unlocked after you perform a few actions like customizing your blog and liking posts.
  3. In the Link to field, add the URL for the specific tagged posts you want to link to. Add /tagged/mytag to the end of your blog URL, replacing mytag with the tag you want to use. For tags with multiple words, use %20 between each word (i.e., /tagged/bubble%20tea).
  4. Choose a name for your new page in the Page title field.
  5. Click Save.

To learn more about Pages, see our Blog Pages article.

Back to top

Contact Support

tumblr_static_dp4toj51xuokgc4ggggko4ww8

gina! author, between other cosas

ACERCA DE ♦ PREGUNTAR ♦ TWITTER

HOME / ARCHIVES

Slytherin pregunta:

Hola, quisiera saber como puedo redirect desde mi pagina principal, un /tagged/wo algo asi porque no quiero que se vean todas las cosas que publico en mi blog porque algunas no encajan, me preguntaba si sabrías que hacer?

Puede usar este script (péguelo entre sus etiquetas de encabezado <head></head> or antes de su etiqueta de cuerpo final </body>):

<script type=”text/javascript”> if(location.pathname == “/”) location.replace(“/tagged/w”); </script>

#conseils #conseils tumblr #questions #thèmes #code #codes gina #code de redirection 

256 ♥ / Publicado el 08 de julio de 2014

Mostrar notas y respuestas

← Publicación anterior Siguiente publicación →

RELATED POSTS

Q: that redirect code you posted is a godsend, thank you so much!

Glad to help! 🙂 Web development is my line of work, so I’m happy to answer any questions about HTML/CSS/Javascript or general themeing.

3 ♥ / Sep 2013

Q: hey! i was wondering, since im thinking of changing my url soon, if there’s a bit of code that will change every link in my tags page to my new url, or do i have to do it manually? thanks [:

You can always copy and paste the HTML into a word doc and replace all of ‘prince-neil’ to whatever your new url is, no code necessary 😉

You can also remove the hostname completely, if you know how URLs work, like how I do mine in my tag page:

image

All you need is the pathname (starting with the slash) if you are linking internally (i.e. links inside your own tumblr). It’s a shorthand that automatically fills in the hostname from your page’s current hostname.

This is your hostname in bold and pathname in italics : oddhour.tumblr.com/graphics

Something linked to /tagged/graphics would go to

  • tumblr.com/tagged/graphics if you click from the dashboard
  • oddhour.tumblr.com/tagged/graphics if you click from my tumblr
  • prince-niel.tumblr.com/tagged/graphics if you reblogged this post and clicked it from your tumblr

13 ♥ / Jul 2014

Q: hihihi i was wondering if there’s a way to wait a certain amount (eg, say 5 seconds) before redirecting a page automatically with the code you posted? thanks in advance :)))

Yes! You’ll need to add a setTimeout call , which adds a delay before “doing something”, that something being the redirecting code. Your code will look like this instead (make sure all quotes are straight quotes; tumblr keeps auto-converting quotes and curly quotes won’t work in code):

<script> setTimeout(redirectTumblr, 5000); function redirectTumblr() { location.replace(‘http://oddhour.tumblr.com’ + location.pathname); } </script>

Vous pouvez remplacer le 5000 par un autre nombre pour ajuster le délai (c’est en millisecondes, donc 5000ms = 5s).

(article original ici)

229 ♥ / octobre 2013

Redirigez vos anciens liens tumblr vers votre nouvelle URL – de la bonne manière !

A quick Google search told me that apparently no one knows how to do this properly 😛 You can redirect all your links from your old tumblr url to the same respective links on your new tumblr url (as long as you have your old url saved i.e. on a sideblog). This doesn’t just always redirect old links to your new tumblr’s homepage.

This is like going to: http://oddhouredproductivity.tumblr.com/tagged/tips (try it!)

and the URL automatically changes to: http://oddhour.tumblr.com/tagged/tips

If you’ve ever tried to find a post from someone’s old url on their new url, you know how annoying it can be.

How to: add this script either before your ending body tag (</body>) or in the header section (<head></head>) of the tumblr where you saved your old URL. Replace oddhour.tumblr.com with your new URL.

<script> /* redirect to the new blog :: any questions? ask oddhour on tumblr */ location.replace(‘http://oddhour.tumblr.com’ + location.pathname); </script>

  • To add a delay before the redirect, refer to this post.
  • Pour un thème de redirection simple comme le mien ou pour un exemple de ce script en cours d’utilisation (avec retard) , voir le code ici.
  • Avoir une question? Vérifiez d’abord la balise de code #redirect .

16837 ♥ / sept. 2013

Q : Salut =) J’ai une question à propos des thèmes sur tumblr… sur mon tableau de bord, l’espace entre les gifs/photos dans un gifset/picset est maintenant plus petit qu’il ne l’était autrefois. Sur mon blog c’est encore avec le plus grand espace. Existe-t-il également un moyen de réduire l’espace dans le thème du blog ?

Oui! Voici un script qui réduira les marges entre les photos dans les ensembles de photos à 4 pixels, ce qui correspond aux marges actuelles sur le tableau de bord.

(this script requires Jquery. If your theme does not use Jquery, please add it by pasting this script somewhere before the margin reducer script)

<script src=”https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js”></script>

Margin reduction script:

<script type=”text/javascript”> /* by oddhour.tumblr.com */ var updatePhotosetCss = “<style>.photoset .photoset_row { margin-top: 4px; } .photoset .photoset_row .photoset_photo { margin-left: 4px;} </style>”; $(window).on(‘load’, function() { $(“.photoset”).each( function (i, e) { $(this.contentDocument).find(“head”).append(updatePhotosetCss) ; }); }); </script>

Comme avec la plupart des scripts, ajoutez ce script soit avant votre balise de corps de fin (</body>) soit dans la section d’en-tête (<head></head>). Assurez-vous qu’il se trouve quelque part après l’ajout de jquery à votre thème.

43 ♥ / juin 2015

Q : Bonjour Gina, je me demandais simplement comment faire en sorte que votre barre latérale reste immobile sur votre tumblr même lorsque la fenêtre de votre navigateur est réduite ?

Ooh that’s a bit of javascript I wrote. It might be scary-looking/technical for the casual user and I can’t guarantee it’ll work for all themes, since the script is dependent on the theme’s CSS. But if you’re a theme-maker then you can—and should!—put this in your fixed-sidebar themes, and please reblog this so I know!

Brief explanation: In CSS, what you know as “stationary” is called “fixed position.” It means the element stays in the same location on your browser no matter where you scroll, sometimes on top of other elements… like your posts. My script detects when you are scrolling horizontally and changes the location so that it mimics being only fixed when you are scrolling vertically. This will take effect when your page finishes loading.

marginLeft = newOffset + “px”; }); });</script>

How to use:

Add the script between your <head></head> tags or before your end </body> tag. Replace “sidebar” in this line:

var fixedElement = document.getElementById(‘sidebar’);

with the id of the fixed element, in quotes. You can find the fixed element by searching for the element with this piece of CSS:

#sidebar { position: fixed; …}

Confirm by finding the element in your HTML, something like this:

<div id=’sidebar’>

Some themes use a class instead of an id (it uses a dot instead of a hashtag in your CSS, like “.sidebar” ). If your fixed element does not have an identifier, add one; the name doesn’t matter as long as it doesn’t conflict with another identifier name.

16 ♥ / Apr 2014

Supports 500px and 540px photo sets in your theme

Intermediate knowledge of HTML/CSS required. Some knowledge of javascript can help.

This is a fix for photosets on themes until tumblr fixes it on their end. (For photos, see this post.) If tumblr make changes to their photoset code, this script may break, so use at your own risk! This code is THEME-DEPENDENT, as your theme must be designed to display both 500px and 540px width posts.

What this script actually does: It will take the highest resolution images available and shove it into the photoset. 500px photosets will stay 500px wide. 540px photosets will be 540px. If the photoset images are larger than 540px, it will scale down to 540px. There may be flickers, as the images load. This script may lag on pages with many photosets, so you may want to restrict this script to permalink pages.

Why you should do this even if you’re using custom user styles: this makes your blog prettier for everyone else, too!

<script src=”https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js”></script> <script> /* any questions? ask oddhour.tumblr.com */ var updatePhotosetCss = “<style id=’updatePhotosetStyle’> .photoset .photoset_row img { display: block; } .photoset .photoset_row.photoset_row_1 img { max-width: 540px; } .photoset .photoset_row .photoset_row_2 img { max-width: 268px; } .photoset .photoset_row.photoset_row_3 img { max-width: 177px; } .photoset .photoset_row .photoset_photo { margin-left: 4px; } .photoset .photoset_row { text-align: center ; width: 540px; } .photoset { width: 540px; }</style>”; function updatePhotoset() { $(“.photoset:not(.540-resized)”).each( function (i, e) { if($(this.contentDocument).find(“#updatePhotosetStyle”).size() <= 0) $(this. contentDocument). find(“head”).append(updatePhotosetCss); var photoset = $(this.contentDocument).find(“.photoset”); var photosetRows = photoset.find(“.photoset_row”); photoset.find(“.photoset_photo”) .each(function () { var hiResSrc = $(this).attr(“href”); var img = $(this).find(‘img’); img.attr( “src”, hiResSrc ); img.attr(“style”, “”); }); photosetRows.attr(“style”, “”); photoset.attr(“style”,””); photoset.addClass(“540-resized”); $(this).height($(this.contentDocument.body).height()); }); } updatePhotoset(); var photosetTimer = setInterval(updatePhotoset, 1500); $(window).on(‘load’, function () { setTimeout(function() {clearInterval(photosetTimer)}, 2000); }) </script> var photoset = $(this.contentDocument).find(“.photoset”); var photosetRows = photoset.find(“.photoset_row”); photoset.find(“.photoset_photo”) .each(function () { var hiResSrc = $(this).attr(“href”); var img = $(this).find(‘img’); img.attr( “src”, hiResSrc ); img.attr(“style”, “”); }); photosetRows.attr(“style”, “”); photoset.attr(“style”,””); photoset.addClass(“540-resized”); $(this).height($(this.contentDocument.body).height()); }); } updatePhotoset(); var photosetTimer = setInterval(updatePhotoset, 1500); $(window).on(‘load’, function () { setTimeout(function() {clearInterval(photosetTimer)}, 2000); }) </script> var photoset = $(this.contentDocument).find(“. photoset”); var photosetRows = photoset.find(“.photoset_row”); photoset.find(“.photoset_photo”) .each(function () { var hiResSrc = $(this).attr(“href”); var img = $(this).find(‘img’); img.attr( “src”, hiResSrc ); img.attr(“style”, “”); }); photosetRows.attr(“style”, “”); photoset.attr(“style”,””); photoset.addClass(“540-resized”); $(this).height($(this.contentDocument.body).height()); }); } updatePhotoset(); var photosetTimer = setInterval(updatePhotoset, 1500); $(window).on(‘load’, function () { setTimeout(function() {clearInterval(photosetTimer)}, 2000); }) </script> var photosetRows = photoset.find(“.photoset_row”); photoset. find(“.photoset_photo”) .each(function () { var hiResSrc = $(this). attr(“href”); var img = $(this).find(‘img’); img.attr(“src”, hiResSrc); img.attr(“style”, “”); }); photosetRows.attr(“style”, “”); photoset.attr(“style”,””); photoset.addClass(“540-resized”); $(this).height($(this.contentDocument.body).height()); }); } updatePhotoset(); var photosetTimer = setInterval(updatePhotoset, 1500); $(window).on(‘load’, function () { setTimeout(function() {clearInterval(photosetTimer)}, 2000); }) </script> var photosetRows = photoset.find(“.photoset_row”); photoset.find(“.photoset_photo”) .each(function () { var hiResSrc = $(this).attr(“href”); var img = $(this).find(‘img’); img.attr( “src”, hiResSrc ); img.attr(“style”, “”); }); photosetRows.attr(“style”, “”); photoset.attr(“style”,””); photoset.addClass(“540-resized”); $(this).height($(this.contentDocument.body).height()); }); } updatePhotoset(); var photosetTimer = setInterval(updatePhotoset, 1500); $(window).on(‘load’, function () { setTimeout(function() {clearInterval(photosetTimer)}, 2000); }) </script> var img = $(this).find(‘img’) ; img.attr(“src”, hiResSrc ); img.attr(“style”, “”); }); photosetRows.attr(“style”, “”); photoset.attr(“style”,””); photoset.addClass(“540-resized”); $(this).height($(this.contentDocument.body).height()); }); } updatePhotoset(); var photosetTimer = setInterval(updatePhotoset, 1500); $(window).on(‘load’, function () { setTimeout(function() {clearInterval(photosetTimer)}, 2000); }) </script> var img = $(this).find(‘img’); img.attr(“src”, hiResSrc ); img.attr(“style”, “”); }); photosetRows.attr(“style”, “”); photoset.attr(“style”,””); photoset.addClass(“540-resized”); $(this).height($(this.contentDocument.body).height()); }); } updatePhotoset(); var photosetTimer = setInterval(updatePhotoset, 1500); $(window).on(‘load’, function () { setTimeout(function() {clearInterval(photosetTimer)}, 2000); }) </script> var photosetTimer = setInterval(updatePhotoset, 1500); $(window).on(‘load’, function () { setTimeout(function() {clearInterval(photosetTimer)}, 2000); }) </script> var photosetTimer = setInterval(updatePhotoset, 1500);

How to use:

  1. Add this script before your ending body tag (</body>) or in the header section (<head></head>). If you already have jquery on your theme, you don’t need to add this first line; just paste the rest after your jquery library. If you have no idea what I’m talking about, it’s probably best not to change anything.
  2. Update your theme. Your theme should use the responsive photoset tag, i.e. {Photoset}, not {Photoset-250} or one of the numbered variations.
  3. If your photo sets display at the correct size but appear cut off, your theme’s post containers are likely designed to hold posts 500px wide. You should update your theme so that post containers and columns are at least 540px wide. Themes vary, so you need to understand HTML/CSS for this last step.

Note: If you only want to have all photo sets at 540px (stretch created photo sets to 500px), use {Photoset} and make your container 540px wide.

(6/8/17 – style updated due to tumblr updates – permalink for latest updates)

533 ♥ / Dec 2014

Q: Hi, I was just wondering how do I get one of these “currently” dropdowns? I really want one but I’m having trouble finding this stuff :/

It’s a bit of HTML/CSS that I wrote from scratch, made to fit my theme, so it’s not something you can necessarily paste into any theme and it’ll have looks good. If you have a bit of know-how and want to write your own, you should check out the tutorials on drop-down navigation menus, because they’re pretty much the same idea 🙂

Mine is a CSS-only and fairly self-contained hover. It’s designed to be on the right side of the page, so if you want one that opens on the left, you’ll need to use opposite text alignments. This is my own code that I wrote; if you use it, please like/reblog! And if you post a theme with it, please credit it.

8 ♥ / May 2014

Q: Omg Gina, that’s a bit awkward, but I don’t know who else to ask. So I’m in the middle of one of these big re-dos themes (I’ve had my old one since 2011 and it kinda sucks) and I really want to get one of these quotes. I mean, I don’t know what they’re called, but I’ve seen these simple, clean things with little pictures in the corner and when you hover over them, a little quote pops up? HOW ARE THEY CALLED and how can I insert them into my theme? So sorry about that 🙁

Ooh could you show me an example maybe? Link me one via fanmail or mutilate one in the request box if the items below don’t help.

First, are you talking about the title text of a link? like when you hover over this link. You can add a title like this (# is just a placeholder):

<a href=”#” title=”hi I’m a title text”>link</a>

In general, to make any type of element appear on hover, you could have something like these CSS rules:

#currently table { display:none; }#currently:hover table { display: block; }

Which is part of the CSS for my “currently” box. That said, whenever I hover over the #currently element (which includes the “currently” header and the little arrow and the table inside) please show the table(s) inside #currently . When I’m not hovering, don’t show the board.

If you want to get fancy with fade or slide animations and such, you can look into jquery animations.

0 ♥ / Apr 2014

only those who have followed me forever know how crazy it is for me to be published and now you can order my book (actual physical book with professional edition and glossy cover) from various hell sites to THIS

7 ♥ / Nov 2021

← Next Previous →

tumblr page counter

impixu impixu


Video How to redirect to a tag on tumblr

Related Posts

How to add seo keywords in wordpress

Contents1 Cómo agregar palabras clave de SEO en WordPress (aumentar el CTR y las clasificaciones)1.1 Post Title1.2 Headline1.3 Header Tags1.4 Introduction and Conclusion1.5 Body Copy1.6 URL1.7 Meta…

How to embed google calendar into wordpress

Contents1 How to Add a Google Calendar in WordPress (Step by Step)2 Add a Google calendar to your website3 calendario de Google3.1 Versatile plans and pricing4 Video…

How to change the logo in wordpress

Contents1 How to Add a Custom Logo to Your Site Header2 Site Logo2.1 Planes y precios versátiles3 Add, remove or edit a custom logo4 Video How to…

How to add a popup on wordpress

Contents1 Easily create a WordPress emergent form (2 forms)1.1 ¿Por qué usar un formulario emergente de WordPress?1.2 Método #1: Crear un formulario emergente con OptinMonster + WPForms1.3…

How to roll back wordpress version

Contents1 How to Revert WordPress: Undo WordPress Updates (Easy Way)2 How to Downgrade WordPress & Roll Back to a Previous Version2.1 1. A WordPress update included significant changes…

How to rollback wordpress version

Contents1 How to Downgrade WordPress and Revert to an Older Version1.1 1. A WordPress update included significant changes that are not compatible with your theme or plugins1.2…