YouTube on Profile Page [Deleted]

[Paul B]

Based upon some google searching, it seems that YouTube is implementing a minimum height and width requirement to facilitate their ads. I read that 230 x 230 is the minimum required. On my sight, this work and makes it so the video plays, however it pushes the video into other things since I am using a fixed width. I will probably have to change the fixed width so that it works correctly. Here is currently the way it looks.

I have added this to EXTRA.css to increase the size of the left sidebar:

.profilePage .mast {
width: 246px !important;
}
 
.profilePage .main {
margin-left: 254px !important;
}
 
.profilePage .avatarScaler img {
max-width: 246px;
}

I then changed the YouTube embed code to match:

<xen:hook name="ad_member_view_below_avatar" />
 
<xen:if is="{$user.customFields.profile_youtube}">
    <div style="margin-top: 4px; margin-bottom: -5px;">
        <iframe width="246" height="172" src="http://www.youtube.com/embed/{$user.customFields.profile_youtube}?wmode=opaque" frameborder="0" allowfullscreen></iframe>
    </div>
</xen:if>

Before:


After:

 

[Jakaan]

http://www.xfshowcase.com/members/sheldon.3/

Try the same video link on your page, with the code I supplied. I am betting if you change the video, it will work.

Yes, that is correct. It does appear that certain videos are better suited for smaller players. I wish there was a way to tell the difference between those that do and don't.

 

[Sheldon]

Yes, that is correct. It does appear that certain videos are better suited for smaller players. I wish there was a way to tell the difference between those that do and don't.

Unfortunately, it has been luck for me. I have had a video show the "too small" thingy... I just found another video and moved on.. lol.

I see Brogan's modification... that might work for you as well. I have never tried it, but if he has it up, he has done so for a reason.

 

[Jakaan]

I have added this to EXTRA.css to increase the size of the left sidebar:

.profilePage .mast {
width: 246px !important;
}
 
.profilePage .main {
margin-left: 254px !important;
}
 
.profilePage .avatarScaler img {
max-width: 246px;
}

I then changed the YouTube embed code to match:

<xen:hook name="ad_member_view_below_avatar" />
 
<xen:if is="{$user.customFields.profile_youtube}">
    <div style="margin-top: 4px; margin-bottom: -5px;">
        <iframe width="246" height="172" src="http://www.youtube.com/embed/{$user.customFields.profile_youtube}?wmode=opaque" frameborder="0" allowfullscreen></iframe>
    </div>
</xen:if>

Before:
View attachment 44358

After:
View attachment 44360

I am just going to have to figure out a solution that works with Flexile Dark. This is what happens when I implement this solution:
http://awesomescreenshot.com/06a15pt368

By the way, thanks for showing me that there is always a solution... Its just not always easy finding it.

 

[Paul B]

You just need to reduce the .profilePage .main margin-left: 254px it looks like.

 

[Paul B]

I discovered an issue with the above approach.

To resolve it, just add this to EXTRA.css:

.profilePage .avatarScaler img {
max-width: 246px;
}

Then change the profile page sidebar width in Style Properties -> Member Profile Page -> Sidebar Width: 246px

I have chosen 246px as it enables four avatars to be displayed on a single row for the Following and Followers blocks. You may need to adjust the dimensions to suit your style.

The other thing you will need to do is edit the /library/XenForo/ControllerPublic/Member.php file to change $followUser to 6.

 

[Sheldon]

This resource has been removed and is no longer available for download.

 

[russoroni]

@Sheldon I see that this has been deleted. Why is that?