Customizing a New Theme

  • Unknown's avatar
    michaelohleong · Member ·

    After live chatting with a Happiness Engineer I came to the conclusion that it would be best to change my theme in order to get the desired look I wanted for my site. Unfortunately I’m struggling to use my new theme, so I apologize in advance if one of my questions might seem stupid.

    First off, for some bizaree reason there is white space at the bottom of all my pages with a small :) face at the bottom left corner. This is located beneath the “Powered by WordPress.com” footer on every single page. I have no idea how to get rid of it but it is making me absolutely seeth with frustration, specifically the :) face.

    Secondly, my theme set up gives a HTLM code to enter when making a page in order to display a colored “Read More” button that leads to the full page. However the read more button also displays on the actual page. in order to prevent all of the page’s content from showing I was told to put <more>. But when I do that it sits under the read more button instead of only displaying the “Read More” button.

    Lastly there is a thin black bar that displays between my second content block and footer widgets. I’d like that removed.

    My apologize for rambling on. Hopefully someone can help me.

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

  • Unknown's avatar
    baldfreud · Member ·

    Hi,

    >First off, for some bizaree reason there is white space at the bottom of all my pages with a small :) face at the bottom left corner. This is located beneath the “Powered by WordPress.com” footer on every single page. I have no idea how to get rid of it but it is making me absolutely seeth with frustration, specifically the :) face.

    Would you mind sharing a screenshot to where you are seeing this exactly? When I click on a page on your site I am not seeing any whitespace nor a smiley face.

    >Secondly, my theme set up gives a HTLM code to enter when making a page in order to display a colored “Read More” button that leads to the full page. However the read more button also displays on the actual page. in order to prevent all of the page’s content from showing I was told to put <more>. But when I do that it sits under the read more button instead of only displaying the “Read More” button.

    When it comes to “read more”, this is specific to “Page Content” and “Second Content Block” in your theme and will not work in the “First Content Block”, where you have inserted the “Continue reading” link.

    You can read more here:
    https://wordpress.com/theme/pena/setup

    I can also suggest reading here:

    https://en.support.wordpress.com/more-tag/

    >Lastly there is a thin black bar that displays between my second content block and footer widgets. I’d like that removed.

    I am guessing you are referring to the black line on the top of the footer?
    You can remove this line by pasting this code into your CSS editor, you have to go to your Customizer and then choose CSS from the left panel:

    `
    .footer-widgets.clear {
    border-top:0px;
    }
    `
    If you don’t know how to do this, then you can find more info here:

    https://en.support.wordpress.com/custom-design/editing-css/

    Let us know if this helps and whether you have more questions.

  • staff-zinnia · Staff ·

    Hi – Please let me know which sites y’all are working on. Happy to have a look.

  • Unknown's avatar
    michaelohleong · Member ·

    Hi bald,

    Fortunately for me, the Happiness Engineer I was live chatting with before I went to sleep fixed my first issue with the white space and :) face for me after our conversation had ended.

    As for the “Read More” question I had: I’ve managed a “work around”. If you look at my home page you’ll notice that the “STAY UP TO DATE” tile has a Read More button on it which links to a different page instead of the page that has the icon as the featured image and brief excerpt. However I’ve run into two issues with this. The first issue being when I press the orange “Read More” button it opens the embedded link in a separate window despite me selecting it not to do that. On top of that when you click on the “STAY UP TO DATE” tittle and Globe Icon it links to the original page. Is there anyway to disable the icon and the title from linking to the original page?

    Thanks for the help with the footer. It worked perfectly :)

    staff-zinnia the site is coincounseling.org

  • Unknown's avatar
    thesacredpath · Member ·

    Hi @michaelohleong, we can add CSS to (supposedly) make the image not clickable, but the problem is that not all browsers will respect that, and even though the cursor doesn’t change to the little hand icon, the image would still be clickable in some browsers.

    Let’s start with this. What I’ve done is to hide the entry title from the stay up to date bit, so it isn’t clickable to the wrong link, and then used a CSS pseudo selector to add that text above the paragraph that contains the read more button, and styled that text to match the titles on the other two. 

    #post-371 .entry-content p::before {
  content: "STAY UP TO DATE";
  color: #9e6100;
  font-weight: 300 !important;
  font-family: "brandon-grotesque-1","brandon-grotesque-2",sans-serif;
  padding-bottom: 15px !important;
  font-size: 1.375rem;
  position: relative;
  top: -5px;
}
#post-371 .entry-content .button {
  margin-top: 20px;
}
#post-371 .entry-title {
  display: none;
}

    The following is the code to make the image appear to be not clickable. As I noted, some browsers respect this code and some do not. Most notably, Safari. 

    #post-371 .post-thumbnail img {
  pointer-events: none;
  cursor: initial;
}
  • Unknown's avatar
    michaelohleong · Member ·

    So after doing some research and consulting support, I figured the best way to handle the issue was by leaving the <more> blank and making it so that the featured image on the actual page is different. This way I don’t have to worry about which browsers the website will function correctly on and reduce the clutter of duplicate pages. I greatly appreciate the assistance.

    However now I’ve run into another issue. To my knowledge my theme allows me to display featured blog posts on my homepage. I set this up with no issue, except that the side bar appears on the homepage despite me selecting the option not to display the side bar there. What am I doing wrong? Can this be fixed in CSS? Obviously I want my side bar but not on my homepage.

    Thanks in advance

  • Unknown's avatar
    thesacredpath · Member ·

    Hi there, if you look at the Pena demo site, you will see that there is a sidebar on the blog posts on the main page. You can use Widget Visibility to control where the widgets appear and where they do not. Go to Customize > Widgets and open the widgets that are showing on the main page, and click Visibility. Select “Hide” then select “Page” and then select “Front page” and save the widget changes, and then click the Publish button to save the overall changes.

  • Unknown's avatar
    thesacredpath · Member ·

    For reference, here is out Widget Support Page.

  • The topic ‘Customizing a New Theme’ is closed to new replies.