If this tutorial is not what you were looking for, you still have any questions, suggestions or concerns - feel free to let us know. Please help us to serve you better!

Your Name

Your Email

Your Message (required)

captcha

Featured templates

Drupal 7.x. How to add custom “Read More” link to Home page blocks

This tutorial shows how to change Read More link to custom one in Drupal 7.x..

Drupal 7.x. How to add custom “Read More” link to Home page blocks

  1. First, log into Drupal back-end and check what content is assigned to block: rollover block and click the Edit View link. Find content type under the Filter criteria heading.

  2. Next, navigate to Structure -> Content types -> {your content type} -> Manage fields tab:

    Drupal 7.x. How to add custom Read More link to Home page blocks-1

  3. Fill out two fields: Add new field and Select a field type. Set the last one to Link. The Form element to edit the data field will change to Link automatically, click the Save button:

    Drupal 7.x. How to add custom Read More link to Home page blocks-2

  4. On the next screen click the Save field settings button.

  5. On next screen configure new link field: edit field Label, set field as Required, select link type, set default values as link target, css classes and title. Save field configuration.

  6. Now you should add new field to block: navigate to Home page – Block, rollover block, click the Edit View link. Under the Fields heading click the Add button:

    Drupal 7.x. How to add custom Read More link to Home page blocks-3

  7. In the Add fields popup window, insert your new field name into the Search, check new field name in the search results and click the Apply (all displays) button:

    Drupal 7.x. How to add custom Read More link to Home page blocks-4

  8. With that done, you’ll be redirected to Configure field screen, click the Style Settings tab. Check the Customize field HTML option, select DIV in the HTML element menu. Check the Create a CSS class option and insert your class into the CSS class field:

    Drupal 7.x. How to add custom Read More link to Home page blocks-5

  9. Next, disable default Read More link that was set up with the Home page block.

  10. In the block, click the Content:Link option. In the popup option, check the Exclude from display field. Next, open the Style settings tab in the same popup window and copy its CSS Class. Click the Apply button.

  11. Now open the new field you’ve added to the block and paste CSS class into it.

  12. The last step is to add new field into the content. Navigate to Content, filter Content by Type using the corresponding field and click Edit link:

    Drupal 7.x. How to add custom Read More link to Home page blocks-6

  13. Scroll the Node editor page down to find new field you’ve created, fill out the Title and URL fields. Click the Save changes button and check new button link at the front-end:

    Drupal 7.x. How to add custom Read More link to Home page blocks-7

Feel free to check the detailed video tutorial below:

Drupal 7.x. How to add custom “Read More” link to Home page blocks