Moving the "see more" button to below the tag line in Arcade theme

  • Unknown's avatar

    Hi there,

    I’m not versed in CSS at all but I do need to have this button moved to either under the tag line or to the right of it. I also want to change the button to read “Read More”.

    Any help would be greatly appreciated :)

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar

    Hi there, This will move the see more button below your tagline, but the caveat is that the area below the tagline gets narrower and narrower as a browser window is widened, and at about 1960px in width, the see more button will overlap the tagline. With that in mind, the following CSS uses a Media Query to only move the see more button when a browser window is narrower than 1960px just in case someone with a larger desktop monitor would be viewing your site with their browser window set very wide.

    ;Go to Appearance > Customize > CSS, delete all the informational text in that window, and paste in the following custom CSS.

    @media screen and (max-width: 1960px) {
      #more-site {
        position: relative;
        top:200px;
      }
    }
  • Unknown's avatar

    Thank you so much!

    I’m going to be adjusting the title and tag line position to helpfully remedy this a bit.

    I really appreciate the help!

    Any hints on how to change the text from “see more” to “read more”?

  • Unknown's avatar

    You are welcome.

    Due to the way the text is done in the See More tag, it can’t be replaced. In some themes, the text is within a span tag, and in those instances we can hide the original text and then use a :before or :after pseudo selector to add new text, but not in this case.

  • Unknown's avatar

    That’s unfortunate, but I appreciate the help.

    Have a great weekend :)

  • Unknown's avatar

    You too, and you are welcome.

  • The topic ‘Moving the "see more" button to below the tag line in Arcade theme’ is closed to new replies.