How to Embed Images or HTML Content on Tumblr [Ejemplo]

Tumblr allows you to add multimedia content through its tools. But being a microblogging platform allows the user to experiment a little more to have an account 100% customizable you can even embed images or any other type of content in HTML.

You can include multimedia content through the HTML code of your account, and even modify make small configurations. Tumblr allows users to access the HTML code associated with your profile and modify it.

Add media content in HTML on Tumblr

  • Access the Tumblr page from your browser.
  • Log in with your access data.
  • Click the icon to add new content or in the Link icon of the Dashboard.
  • Replace the url option with the address of the photo or video. The photo must be uploaded and available before doing this step.

Add media content in HTML on Tumblr

  • To finish press the Publish button. Now the image is loaded into the post.

Embed content in blog topic

  • Select the option Personalize found on the control panel.
  • Choose the Theme tab.
  • Click on the Use option Custom HTML.

Now you can modify the theme of your blog at will. This option is recommended if you have HTML knowledge, otherwise you could affect its operation.

Add a table in HTML

Adding multimedia content is easy, but if you want to add a table, you have to have a little more patience. It is a simple process, but it takes time.

You have to add the rows and columns of the table, as well as its content by means of HTML code. This is done through the Tumblr HTML editor.

  • Access your Tumblr account from your PC browser.
  • Enter your username and password to access your account.
  • Select the Settings icon.
  • click on the Customize your blog option. then choose the Theme option.
  • The HTML editor opens to modify the design of your blog.
  • Look for the hashtag within the code.
  • Choose where in the bodysuit you want to place the table.

Add the code in the HTML editor

The tr tags are used to define the tables and the Td tags are used to map the content. The table is defined with the Data label within the code.



  • Row 1 Name
    Row 1 Surname
    Row 1 Mail


    Row 2 Carlos
    Row 2 Pérez
    Row 2 [email protected]

The table has the alignment attributes of cells text in the center, but it is a value that you can change to the left or right. The border attribute at 1 means that the table has a border, if you don’t want it to be displayed change the value to 0.

Add the code in the HTML editor

The cellspacing attribute determines the pixel space between each row. To add a new row to the table, put the label first and subsequently as an opening tag.

Modify the values ​​that you consider necessary or add new ones and when you finish, place the hashtag. Then press the Update button and save the changes made.

To see what the final result was, click on the profile button, you will see that your table is already displayed right where you placed it. If you want to add more columns to the table just add another block with the label

followed by the elements

. Don’t forget to do the closing the labels.

You can also add other attributes to the table like the Float, and indicate that it is on the right or left. You have many options, even adding images, changing the background of the table or the color.

Source by

Deja un comentario