Updated: New Profile Content Block Design / Simplified Settings

leftquark

We've just pushed an update to the Profile Content Block to update its look and feel a bit. Most notably the Social Icons and description fit much nicer on the profile.

- Simplified Content Block Settings: enable or disable the profile photo, cover photo or social icons.
- Social Icons always pull from the "Profile" (in the User Menu)
- No longer ability to have "Custom" Profile data in the Customizer that differs from the Profile. This was confusing a lot of users. Users who had custom data will still see that custom data but going forward it will always pull from the Profile.
- Sanitized HTML is allowed in the Description.
- If no Cover Photo is set, owners will see some texting letting them know they can set one.
- If no Profile Photo is set, an empty silhouette is no longer shown to your visitors. We'll just stick with your cover photo. For owners, you'll see the empty silhouette to remind you that you can set one.

pegelli

I don't like it but will probably have to live with it. Why spend resources here if you haven't fixed the BBcode issue in the share panel yet, that's a way more important issue and deals with functionality (which wins over good looks every day)

Now some specifics:
- Is there a way to increase the container height so more text can be shown?
- Is there a way to choose the part of the cover photo being shown when it's cropped?
- There is a bug on how the cover photo is shown, normally it shows the middle (top/bottom cropped off) but as soon as I hover my cursor over the field it jumps to showing the lowest part of the image which is also moved above the profile photo/name

leftquark

pegelli wrote: »

I don't like it but will probably have to live with it. Why spend resources here if you haven't fixed the BBcode issue in the share panel yet, that's a way more important issue and deals with functionality (which wins over good looks every day)

We grabbed an extra engineer to get the Share Panel updates moving as quickly as possible, and it's a different resource than the ones working on the Profile CB. On the bright side, the Share Panel updates (which include BBCode and a number of other items) is in test. As soon as QA verifies it's bug free, we'll be pushing it out.

pegelli wrote: »

Now some specifics:
- Is there a way to increase the container height so more text can be shown?
- Is there a way to choose the part of the cover photo being shown when it's cropped?
- There is a bug on how the cover photo is shown, normally it shows the middle (top/bottom cropped off) but as soon as I hover my cursor over the field it jumps to showing the lowest part of the image.

There's some CSS that we can offer that will increase the height of the text container. Would a Text Content Block work better for the longer description, since it has some text formatting features and doesn't require you to use HTML in the Profile Description? If not, I can whip up some CSS changes for you.

There's still no way to choose which part of the cover photo is shown. It's something I'd really love to add, all across the board (including gallery feature images).

Would you be able to send me a link to your site so that I can see the strange jumping behavior / see how we can get that fixed?

pegelli

leftquark wrote: »

There's some CSS that we can offer that will increase the height of the text container. Would a Text Content Block work better for the longer description, since it has some text formatting features and doesn't require you to use HTML in the Profile Description? If not, I can whip up some CSS changes for you.

That would be great, either option is fine (text block or profile description). At the moment the profile description is truncated too short

leftquark wrote: »

There's still no way to choose which part of the cover photo is shown. It's something I'd really love to add, all across the board (including gallery feature images).

Too bad, guess the only option then is to crop your own picture to the same size and upload/use that. It will work but obviously much less flexible.

leftquark wrote: »

Would you be able to send me a link to your site so that I can see the strange jumping behavior / see how we can get that fixed?

https://pegelli.smugmug.com/

Here's screenshots of the "jumping" cover photo:

Normal:


Jumped up:


In only does that on my (owner) home page, not on the visitor view.

leftquark

This CSS (add a "CSS" content block to your homepage) will increase the height of the Description field:

/* Increase the height of the Profile Content Block's Description Field */
.sm-page-widget-profile-v2-description {
    max-height: 100px !important;
}

Change "100px" to whatever height is appropriate for you.

Would you mind letting me know which OS and Browser you're using? The jumping doesn't occur on my computer (Mac El Capitan w/Chrome) but we've got the team looking into it.

pegelli

Thanks Aaron,

My OS is Windows 8.1 and browser Mozilla Firefox version 42.0

Do you have some instructions (or a link where I can find them) how to add this CSS to my homepage? This is new territory for me

Allen

pegelli wrote: »

Thanks Aaron,

My OS is Windows 8.1 and browser Mozilla Firefox version 42.0

Do you have some instructions (or a link where I can find them) how to add this CSS to my homepage? This is new territory for me

On your homepage click "Customize" at the top and click "Content and Design".
In the right flyout click to highlight "Homepage" if it's not already highlighted.
Just below see "ON HOMEPAGE" heading under the content tab.
Look down through the list and see if there is a CSS shown.
If so hover it and click the wrench. This will open the box to add the CSS to.

If there is not a CSS showing scroll down to "ADD CONTENT BLOCKS".
Scroll all the way to the bottom and click "HTML % CSS" to expand.
Drag a CSS out to the bottom of your page.
Hover the box title bar and click the wrench.
When box opens add CSS in it.

pegelli

Thanks Allen, I tried it and failed, as mentioned it is new territory for me.

First it says "ON THIS PAGE" and not "ON HOMEPAGE" (don't know if this is significant or not)
On the list under there there is no CSS shown

Secondly under "ADD CONTENT BLOCKS" there is no "HTML % CSS" which I can click to expand.

Might this have anything to do with my browser settings?

Here's a screenshot of what my "flyout" looks like:



Any help will be much appreciated

leftquark

It appears you have a "Basic" level account, which doesn't have access to the full set of customization features. Your best bet would be to click on the "+" next to "Text" and drag/drop a Text Content Block in, and then add longer amount of text below the Profile.

pegelli

leftquark wrote: »

It appears you have a "Basic" level account, which doesn't have access to the full set of customization features. Your best bet would be to click on the "+" next to "Text" and drag/drop a Text Content Block in, and then add longer amount of text below the Profile.

OK, thanks. Any progress on the "jumping" cover photo?

leftquark

pegelli wrote: »

OK, thanks. Any progress on the "jumping" cover photo?

We're having trouble replicating it ... but our QA tester hasn't given up yet. We did load Firefox in Windows 8.1 and didn't see it jump. When you say "hover over the field" which field do you mean? When you hover over the cover photo?

pegelli

leftquark wrote: »

We're having trouble replicating it ... but our QA tester hasn't given up yet. We did load Firefox in Windows 8.1 and didn't see it jump. When you say "hover over the field" which field do you mean? When you hover over the cover photo?

Hi Aaron, it happens as soon as my cursor hovers over somewhere in the top half of the profile block (height wise between the top of my profile picture and the top of the entire profile block)

Btw 1, Did you see my earlier remark that it only jumps in owner view, well that's not fully correct. It doesn't jump in owner/visitor view of my laptop (Windows 7 and Firefox), while it does jump on my desktop (Windows 8.1 + Firefox). Unfortunately I haven't got any other Windows 8.1 computer to see if it's specific to just my desktop or more general.

Btw 2, I just tested it in Internet Explorer on my desktop and there it doesn't jump.

flyingwolf

I was having an issue with my profile block and noted there was an update, I used to have a nice little fly out faded background that would fly out the text with infomration on my business when you hovered over the profile, additionally i could set it to 80% width of the page and it stayed center and looked good. It looked nice, things worked. I liked it.

With this new change I can no longer center the block, setting it to 80% just tosses it to the left of the page. Rather ugly. Additionally there is no longer a flyout and is instead a rather ugly and useless scrollbar on the right side of the next that doesn't scroll.

http://www.bestlittlestudio.com You can see the issue on the home page.

Is this expected behaviour or should I be worried? Note I would love to keep it as it, I would have preferred to have kept the flyout, but that's fine, but I do want to get rid of the scrollbar, but any change mades in the customer kills the 80% and centered profile.

leftquark

pegelli wrote: »

Hi Aaron, it happens as soon as my cursor hovers over somewhere in the top half of the profile block (height wise between the top of my profile picture and the top of the entire profile block)

Btw 1, Did you see my earlier remark that it only jumps in owner view, well that's not fully correct. It doesn't jump in owner/visitor view of my laptop (Windows 7 and Firefox), while it does jump on my desktop (Windows 8.1 + Firefox). Unfortunately I haven't got any other Windows 8.1 computer to see if it's specific to just my desktop or more general.

Btw 2, I just tested it in Internet Explorer on my desktop and there it doesn't jump.

That sounds like perhaps it's a browser extension on Firefox doing something strange. Do you have any extensions installed?

flyingwolf wrote: »

I was having an issue with my profile block and noted there was an update, I used to have a nice little fly out faded background that would fly out the text with infomration on my business when you hovered over the profile, additionally i could set it to 80% width of the page and it stayed center and looked good. It looked nice, things worked. I liked it.

With this new change I can no longer center the block, setting it to 80% just tosses it to the left of the page. Rather ugly. Additionally there is no longer a flyout and is instead a rather ugly and useless scrollbar on the right side of the next that doesn't scroll.

http://www.bestlittlestudio.com You can see the issue on the home page.

Is this expected behaviour or should I be worried? Note I would love to keep it as it, I would have preferred to have kept the flyout, but that's fine, but I do want to get rid of the scrollbar, but any change mades in the customer kills the 80% and centered profile.

Hmm... the centering thing shouldn't have changed. I'd recommend using a "Spacer" content block to the left/right of the profile, each with 10%, to ensure it stays centered. We're going to take a look at how to improve the design of the description field, since it's clear you guys aren't a fan of limiting it to 3 lines with a scroll.

flyingwolf

As you can see on my site even with only 2 lines of text it still has a scroll bar.
As for the centering, why not have it center by default, I have never known anyone to want something to extend 80% of the width of a page and only have it extend from one side or the other, it is almost always centered in cases like that. Perhaps an ability to center/left/right justify it.

Pegelli, do you by chance have hoverzoom or imagus or any auto mage expanding extension installed? With this new change the profile background is now picked up by those and could be an issue.

aaronpriest

I just sent an email to support thinking they had screwed something up, before finding this thread and discovering they had "improved" my website. BTW, I've been waiting for years for search results to share the same gallery theme settings as the rest of my site, instead of ugly square thumbnails. Why don't you fix things that we really need and stop frustrating us with everything else that we already like?!!

Here was my email:

Something changed recently on my home page graphically. I wish I had a screenshot of how it looked like before to show you, but the change has been entirely on your end as I have not changed anything in several weeks. My profile photo in the lower left corner of the featured image at the top has been shrunk and shoved down into the corner more, when it looked more like it floated before. It was larger, maybe with an outline (can’t recall for sure), and not shoved to the very corner pixel, it looked more like it floated above it as an inset in the featured image. My name and the text below looked a lot better with a different font, and scrolled better. Also, more of the text showed and you only had to scroll to see one more line (which was OK with me if folks never figured out to scroll down to see it), but now you have to scroll to see three more lines that I DO want people to see, probably because my profile image is now smaller and the text of my name is now larger. The social media icons were next to my name and not all the way over on the lower right of the header image. This has caused an awkward up/down scroll bar to appear in the middle of the image that never was there before. It all just looks very ugly now to be blunt.

On mobile devices, you can scroll the text up and down on an iPad, but not on an iPhone anymore. Also, on my iPhone my copyright (All images © Aaron D. Priest) shows twice in a row and doesn’t look as professional, but it’s fine in a desktop browser and on an iPad.

Can you reverse these recent changes and put things back to the way my theme used to look?

akira3d

I really enjoyed the previous profile content block because I used it as a headline atop the different major sections of my site. In made sense to have different profile pics, cover photos, and descriptions per section. I'm glad that the change didn't automatically change what I already have...because the only place I wanted to see my actual profile was on my "about" page.

I only discovered the change because I'm trying to add a new section...and can't figure out an easy way to match what I have on my other pages now. Is there any way to customize this new profile content block behavior to change the profile pic, cover photo, and description?