Search code examples
tumblr

Remove default "Source:" from Tumblr


I want to stop the default Tumblr "(Source: _____ )" from displaying at the bottom of my posts. I've tried inserting the code and the jQuery from this tread, but it doesn't work.

I can hide it using a bunch of CSS codes, but I want a more stable way to hide them. Anyone know how? I contacted Tumblr, but they are no help.


Solution

  • This is the way it works:

    If you have something like (or the source image inside the link);

    {block:ContentSource} <a class="post_source" href="{SourceURL}" title="Source: {SourceTitle}" target="_blank"> Source </a> {/block:ContentSource}

    You can show the source anywhere you want, however you want, and you can hide it by, well CSS; .post_source { display: none }.

    If you do not have something like above, Tumblr will show the source link (like (Source: Source Title)), inside of the post (below everything else), in some cases, it is not always in your control.

    If this does not work, most probably there is something else that is breaking or overriding your rules. Check and let me know. There are always options.

    Update:

    If you do see the "Source" two times, that is where you put it and the one Tumblr appends under some posts, I am pretty sure something else is wrong somewhere, I can not imagine what, since you did not post any codes.
    You can use JavaScript to hide it (If it seems better to you than your HTML and CSS solution. I am not sure how you are doing it, I do not see a better solution than using JavaScript to check the contents inside.):

    In the code used, I assumed you have all your captions, text post body etc inside an element with class .text. Change it to your selector.

    var elem = document.querySelectorAll(".text"), elemCont, i;
    for (i = 0; i < elem.length; i += 1) { 
        elemCont = elem[i].lastElementChild.innerHTML.toLowerCase();
        if (elemCont.indexOf("(source:") === 0) {
            elem[i].lastElementChild.style.display = "none";
        }
    }
    

    What I believe; Do not use any code you do not understand. So explaining (in case something does not look familiar to you):

    • The variable elem selects all the element with the class .text.
    • The for loop loops over all the selected element one after another till we get to the last element.
    • The variable elemCont is equal to; the "Inner HTML", in lowercase (to avoid conflicts when matching later) of the "last child (that is an element)", of the selected element .text.
    • Here [i] is the index (0 or 1 or 2...). Selects one element at a time.
    • Then with an if statement the algorithm checks if the elemCont (contents inside the selected element's last child, or paragraph in this case) starts with (source:. If true, the algorithm sets the last child of the selected element's style to display: "none".
    • Voilà now they are all hidden.