'Portfolio' view a bit strange!

theartofintegralbeing · Member · Jul 9, 2016 at 5:43 pm
Copy link

Add topic to favorites
Hello!

I wonder if you could help me. A while ago I got some CSS from this forum to change the title of ‘Portfolio’ on both the homepage and on the actual page (once directed after clicking) to ‘Inspiration’. This works and I am happy with the appearance. However, when I look at the iPad and mobile view it still shows as ‘Portfolio’ for some reason. Any ides why and how we could change it to the same appearance as the homepage? Also, for some unknown reason (it doesn’t seem to be the CSS but not sure) the button for ‘Inspiration’ on the homepage is not centre-aligned on any of the views.

Look forward to hearing from you! Thanks in advance.

Kind regards,
Gabriella

The blog I need help with is: (visible only to logged in users)
theartofintegralbeing · Member · Jul 9, 2016 at 5:45 pm
Copy link
Hello again!

Also, while I am here, I might as well ask if you can help me with the font on the homepage when in the mobile view. It is different for the text on the homepage. Why and how to change it? Thanks in advance!

Kind regards,
Gabriella
siobhyb · Member · Jul 11, 2016 at 10:00 am
Copy link
Hi Gabriella,

However, when I look at the iPad and mobile view it still shows as ‘Portfolio’ for some reason. Any ides why and how we could change it to the same appearance as the homepage?

Can you find the following snippet in your custom CSS?
```
.post-type-archive-jetpack-portfolio .page-title:before {
    content: "Inspiration";
    font-size: 62px !important;
    color: #fff;
}
```
The color: #fff; line in the above snippet is setting the colour for “Inspiration” to white, making it invisible on the site’s white background. Remove that line in order for the word to become visible.

Replace the line with color: #6e6a70; if you’d like to match the colour that’s been set for the word on desktop:
```
.post-type-archive-jetpack-portfolio .page-title:before {
    content: "Inspiration";
    font-size: 62px !important;
    color: #6e6a70;
}
```
Also, for some unknown reason (it doesn’t seem to be the CSS but not sure) the button for ‘Inspiration’ on the homepage is not centre-aligned on any of the views.

I visited integralyogaworld.com but wasn’t able to see a button with the word “Inspiration” on it. Would you be able to point me to the exact section it appears in? I can help from there.

Also, while I am here, I might as well ask if you can help me with the font on the homepage when in the mobile view. It is different for the text on the homepage. Why and how to change it? Thanks in advance!

The following custom CSS is changing the font on mobile devices:
```
.entry-content {
    background-color: #fff;
    font-family: ff-market-web-1;
    padding: 5px;
}
```
You can remove the above to get the font to be consistent across all devices.

Do you remember why you added the above snippet to your custom CSS? If so, let me know and I’ll see if I can help with CSS that achieves the same effect but doesn’t change all of your site’s font across all devices.
theartofintegralbeing · Member · Jul 11, 2016 at 6:45 pm
Copy link
Thank you for your reply!

In response to the question with regards to the ‘inspiration’ button:
I requested CSs to change the word ‘portfolio’ on the homepage in the button to ‘inspiration’. It appears on the homepage underneath the texts for the homepage and above the 4 images and below the share buttons. For some reason, there are two problems with this portfolio section:

1. The word ‘inspiration’ appears on the computer view only, on the other views it appears as the original word ‘portfolio’
2. It does not appear centre-aligned on any of the views and it doesn’t seem to be a CSS problem.

Thank you in advance,
Gabriella :-)
siobhyb · Member · Jul 12, 2016 at 11:46 am
Copy link
Thank you for clarifying, Gabriella! I can see the button you’re referring to now.

Could you please try adding the following to your custom CSS in order to align “Inspiration” in the centre and hide “Portfolio” from all views:
```
#front-page-portfolio a.call-to-action {
    visibility: hidden;
}

#front-page-portfolio a.call-to-action:before {
    visibility: visible;
    display: block;
}
```
Let me know how that works out or if any extra questions come up.

No items found.