For Rikki... Skinning Suggestions

[skinbydragonfly]

Last time we added a classname for convenience (ipbwrapper), there was nearly a riot ;) People have different needs, wishes and opinions, and it's difficult to accommodate them all unfortunately.

Perhaps.. but probably mostly because they don't understand why it is better.. IPS doesn't justify the coding changes they make (presumably for the betterment of the product) it's the same with the skin system... The re-introduction of a .borderwrap class and it's application to the content areas that current have zero background wrap, and those that currently have the table wrap class (to which a border can't be assigned) would in fact solve all the above problems, and be a huge benefit to the product in terms of it's usablity and customisation... this should have happened with 3.0 but it could now happen at 3.1 - given we are going to have to upgrade skins anyway... both professionals and amatuers and those who self skin alike would hugely benefit in the longer term.

Regarding your suggestions, Kim, I can certainly see how that'd cause problems for anything but the default skin. We'll take a look into it, although it probably won't be for 3.1 (it'd likely be in a Blog update, anyway).

That's a real shame that it won't be looked at sooner, any help on a work around for that blogs page would be really appreciated, as I said I cannot get my usual wrapper class to work in there at all!!!

Oh and btw.. it is not just that one blogs area... There are other areas.

Thanks for answering though Rikki, it's good to know that IPS are listening :)

[Amy T]

Perhaps.. but probably mostly because they don't understand why it is better.. IPS doesn't justify the coding changes they make (presumably for the betterment of the product) it's the same with the skin system... The re-introduction of a .borderwrap class and it's application to the content areas that current have zero background wrap, and those that currently have the table wrap class (to which a border can't be assigned) would in fact solve all the above problems, and be a huge benefit to the product in terms of it's usablity and customisation... this should have happened with 3.0 but it could now happen at 3.1 - given we are going to have to upgrade skins anyway... both professionals and amatuers and those who self skin alike would hugely benefit in the longer term.

That's a real shame that it won't be looked at sooner, any help on a work around for that blogs page would be really appreciated, as I said I cannot get my usual wrapper class to work in there at all!!!

Oh and btw.. it is not just that one blogs area... There are other areas.

Thanks for answering though Rikki, it's good to know that IPS are listening :)

I agree and one ear is the profiles, which I think was mentioned.

[IBTheme]

Okay, now that I feel like a total butt head, I want to say how sorry I am to Rikki and the rest of the IPS crew that my post was just thrown at you like that. Ever since 3.0 was released, IBSkin has become so dead in activity that I never thought it would get copied and pasted here like this. I am very embarrassed and I really didn't mean any harm by it. I was pretty frustrated when I made that post because I had customers emailing me and posting in our feedback forum that our quality of skins was nothing like it use to be since 3.0 was released, and I was in the middle of redesigning an old 2.3 skin for 3.0 and it was then that I realized all that was causing it to take so much aggravation to make just one skin. That post was made more to get the point across to my customers as to why things are so different. I guess I was a little harsh to say the least. I'm very sorry Rikki. I admire your work, it's very professional and advanced, I just don't think it's fitting too well with the system us skinners are use to, and it doesn't seem too user friendly as far as freedoms to truly "skin" instead of just "edit".

I know that times are changing, things are getting more and more advanced and we gotta change with the times. I get all that, but honestly, some of these things, I don't see why they had to change. The things that take away our freedoms as skinners anyway. I'm not talking about how advanced the css is, just how it's being used. That's all.

I was approached today, and shown this thread that I had NO IDEA even existed, and I was asked to contribute some notes based on some of my issues with the skinning for 3.0 and share my thoughts on what I would like to see changed if possible. I don't claim to be an expert on all this, in fact, quite the opposite. I went out and spent over $140 on css and java for dummies books when 3.0 was released because I was feeling so incompetent. At first, I wasn't able to get any of my little premium extras to work in 3.0 and I thought it was me screwing things up or just being outdated in my knowledge on css and html, but as it turns out, I'm finding out that it's not just me.

I know IPS is probably kinda shocked that all this is just now coming out when 3.0 has been out for quite some time now, you would think they would have heard from us all sooner than this, but I think it's mostly because I/we are just starting to get more familiar and somewhat comfortable with IPB 3.0 enough to get more intricate in detail with our skins that we're just starting to notice some things that just didn't pop out in the beginning. I know in my case, my first few skins were a bit more "simple" so I didn't see quite so much of these issues that I'm seeing now. Not to mention the added time.

I don't know if this is all that I have found to be a problem, but this is all that is coming to mind at the moment. I suppose I can add stuff if anything else pops up while I'm working on this skin I'm in to now, but for now, this is all I really have to add...

1.) First and foremost, I know the default avatar is coded in to the software, but it is not set up so that we can create a default avatar on a "per skin" basis. This seems to be a pretty big issue for most of my customers. It was just one of those perks in a premium/paid skin that they looked forward to and helped set it aside from the default based skins. I would like to see that somehow brought back in such a way that we can make the default avatars on a "per skin" basis which would require moving it from the "style_avatars" directory to the "style_images" directory, which I'm assuming has to be done in the php docs, which we all know, I certainly can't do. I know just about enough of php to screw it up really pretty. :D lol This brings me to my next issue...

2.) It would seem, and I put an emphasis on "seem" because again, I'm kinda php stupid so I could be way off basis here, but anyway... it would seem that there are a few too many elements of the skin being controlled by php which is taking away much of our freedom with skinning. I realize the templates are written in html, I get that, but some features like the default avatar are being controlled in the php documents which limits us to what we can do with it. I know this is not the only area of complaint, but following murphey's law as usual, now that I need to think of more examples, they aren't coming to me because I'm trying too hard not to forget anything I need to add here.

3.) I'm having issues in the css where I'll go to edit a block, knowing I have it correct based on the look I was going for, then go in and look at my results only to find it is totally out of whack. So, I'll go searching for possible solutions, and sure enough, it never fails, about 50 or so lines down in the css, there is yet another block of css for the same class that is contradicting what I just inserted before. I can't understand why this second, third, fourth, fifth, sixth and seventh block of css wasn't included with the first block, or at least grouped together so that we can see all elements of that class that are effecting the outcome. It just seems to scattered I guess. This really sucks for someone with A.D.D. like me. LOL ;) I would like to see the classes either grouped together or combined where possible. This would cut down on a LOT of time in skinning.

One example is...

	.row1 .altrow, .row1.altrow,

	.personal_info, .general_box {

	background-color: #eef3f8; /* Slightly darker than row1 */

	}

Then a few lines down there is...

.general_box {

	background-color: #eef3f8;

	border: 1px solid #d5dde5;

	border-bottom: 4px solid #d5dde5;

	padding: 10px;

}


 

(the example being "general_box" of course)

I don't see why that is called on twice. I realize this can be edited to only appear once, but in some cases, if I do something like that, things start going crazy all over the place and I have a total css mess going on. So it's not always that easy to do.

4.) I have found that in some cases, there is a block of css that is used for too many different elements in a skin, so when I go to edit that block of css to make something on the board index page look pretty, it totally distorts something else on another page that is using that same class. For instance; the class ".row2" is used for <td>, <tr> and <div> tags throughout all of IPB. Unless the css is kept kind of "generic", you can really throw off the whole skin by changing "row2" class too much. A class used for a <div> tag doesn't always behave the same way if that same class is used for a <td> tag unless it's kept "generic" such as only changing the background color or font color. If I try to get fancy and add a background image or change the padding or margin or add in a border or something like that to a class that is being used for a <div> tag, obviously, this could throw off a whole table on another page that is using that same class for a <td> tag within the table. It takes hours to go through the templates and find where all "row2" is being used to change it to something else so it's not effected by my custom edits, then there is no guarantee that any logical alternative is going to work because there are so many other blocks for "row2" in the ipb_styles.css that I don't know which elements are effecting which tag unless I take the time to sort through all of them and compare them on each template it's being used. While I have managed to succeed in doing this a few times, I usually end up getting frustrated and just giving up and leaving it alone, thus leaving my "custom " skin having too many "default" elements. We had more freedom with this sort of thing in previous versions of IPB. I guess I just go spoiled. I would like to see classes used for less elements in a skin, giving more elements their own class, and then this would give us more freedom in our skin edits.

5.) In the IPS applications such as gallery, blog, downloads, etc. each one has their own css. The problem is, these applications also use classes that are being used on the IPB side of things and these classes are edited/extended on the css template for its own application as needed. I would like to see the applications use their own classes, separate from the IPB side if possible. Reason being, again, some classes may give a different result than where it was used previously, because its' being used for a different element, or it is being used on a page with a different html layout that may conflict with how it's being used on the IPB side of things. I realize that the applications are suppose to flow with the look and feel of the IPB side of things, so this is why they share css, but this can cause problems if the classes are used in different elements, so separating them completely would be less time consuming during skinnning.

For example...

Instead of using the "row2" class in the gallery, let's put the class directly on the ipgallery.css template and call it something like "gallery_row2" or something like that. This could prevent distortion since "row2" on the IPB side may have a border or a background image that really doesn't work at all for the element using "row2" in the gallery.

Again, I know this can be edited on my own, I'm just suggesting that it would be way less time consuming if this was considered for the default skin since all our custom and premium skins are based off that one.

6.)I know this was already mentioned above by Kim, but I agree with her and want to add that I also feel that there are too many areas in the skin that have transparent backgrounds. It kind of takes away the "neatness" of the whole look and feel of the skin and can cause contrast problems if we decide to use a background image on the body.

And last but not least...

7.) I know this may seem petty, and I can't figure out what is causing this, but on the board index, one of my main features in my premium skins was the "rollover" effect on the forum titles and descriptions in the category blocks. Well, all I can do now is a change of background color or image on that, because if I try to add a border, the rest of the category block goes hay-wire. (yes, I've considered the padding changes, but that doesn't fix the problem either.) I know, I know, this is petty and seems like it's not even worth mentioning, but it looks so much nicer to be able to put a border around the hover effect in my opinion, but for some reason, it's not that simple in 3.0 and I don't know why. I can't seem to pin point it.

It's little things like this that have had me feeling incompetent for quite some time now. It may not seem like much, but it's a bunch of small things piling up to create one big bundle of frustration. All in all, basically my main complaint is, I feel too many of our freedoms as skinners was taken away in IPB 3.0. Our customers got use to us being able to provide certain things, and now we can't offer them anymore. 3.0 has given us more freedoms in some aspects, but taken away just as much, if not more in other aspects. The IPB software has grown, expanded even, with all the applications we have to skin for now, so it is expected that it would take a little longer to make a skin, but 6 days longer, at 14 to 18 hours a day seems a bit much. My work ethics haven't changed any. Only the software has. I've even got a faster system now, with 2 monitors to help speed me up and that's still not helping.

... you know, after reading back on everything I just wrote, I'm starting to feel really incompetent again. I just have this strange feeling that someone is gonna pop up with a simple solution that makes me feel like a total dork. I really hate going totally public with stuff like this. I'm not an expert, just a skinner.

[Lewis P]

@Evanescense - For 1), you can edit userInfoPane with this code (I'm going to guess you know where to put it. ;) )

<if test="avatar:|:$author['member_id'] AND $author['avatar']">

    <li class='avatar'><a href="{parse url="showuser={$author['member_id']}" template="showuser" seotitle="{$author['members_seo_name']}" base="public"}" title="{$this->lang->words['view_profile']}">{$author['avatar']}</a></li>

<else />

    <li class='avatar'><img src='{$this->settings['img_url'}/noavatar.png' alt=''></li>

</if>

Then, noavatar.png in your skin images folder will become default.

[IBTheme]

See... what'd I tell ya ..??! LOL

... you know, after reading back on everything I just wrote, I'm starting to feel really incompetent again. I just have this strange feeling that someone is gonna pop up with a simple solution that makes me feel like a total dork. I really hate going totally public with stuff like this. I'm not an expert, just a skinner.

LOL ;) Thanks so much Lewis! :thumbsup:

[Lewis P]

Hehe, I only learned that today myself. Nothing to worry about. :whistle:

[skinbydragonfly]

Thank you for that Lewis, much appreciated :thumb:

I had asked about this months and months ago, and never got any answers :D

[Amy T]

It will be interesting how this effects IPB 3.1 :).

[IBTheme]

Just re-reading over Kim's post, I wanted to add that everything she has written here is my feelings exactly. This too is very important to me and many of my customers. I have already received complaints about the lack of borders around the content areas, in fact, the complaints about this started rolling in with my IP-Duo skin which was the first one I did for IPB 3.0 that was solely based off the IPB default skin with very few changes other than color and graphics.

imho... having easily adjustable and editable backgrounds to content areas is a must - I think it is pretty fundamental to have a background behind content areas, not rely on the body background. Same with borders to content areas... I haven't checked lately because I have been using my wrapper everywhere instead.. but last time I tried it you couldn't add a border attribute to the main content areas because of the border-collapse: collapse - has this changed? If not.. could it... you should be able to add a border to content areas without drama.

To close dearest Rikki, I know I am not the world's greatest coder, and perhaps I have missed some blatantly obvious way of achieving my aims without all this rigmorole... (Highly likely - But if so you got to ask how total noobs are feeling!!!) and I also know that many of the youngie skinners and grooovsters don't feel borders or footers etc to be totally cool and web2ish etc etc.. but most of us grown ups quite like those things... as my customer base and queue for custom skins says.......and rully trullly it would be most excellent to not have to cry everytime IPS releases a new update because of all the useless non productive, non creative work it creates.

[IBTheme]

It will be interesting how this effects IPB 3.1 :).

I dunno, but it may be a little late to implement too many of these changes in 3.1.
As I understand, they are pretty far along with it, and it could possibly be a little too late for this upgrade.
(just my thoughts, I don't have any information to back that up though)

... and that's if they even consider any of these suggestions. Like I said before, I have this funny feeling that everything I've been trying to accomplish can be done somehow, I just haven't figured it out, and someone is gonna come along with a simple solution that makes me feel like a total idiot. lol

[skinbydragonfly]

Actually I just tried that and it says there is a syntax error in the PHP :unsure:

[Lewis P]

Woops! Missed a closing tag:

<if test="avatar:|:$author['member_id'] AND $author['avatar']">

    <li class='avatar'><a href="{parse url="showuser={$author['member_id']}" template="showuser" seotitle="{$author['members_seo_name']}" base="public"}" title="{$this->lang->words['view_profile']}">{$author['avatar']}</a></li>

<else />

    <li class='avatar'><img src='{$this->settings['img_url']}/noavatar.png' alt=''></li>

</if>

[Amy T]

... and that's if they even consider any of these suggestions. Like I said before, I have this funny feeling that everything I've been trying to accomplish can be done somehow, I just haven't figured it out, and someone is gonna come along with a simple solution that makes me feel like a total idiot. lol

I know that feeling. I bought a how bunch of books from site point on css and php to be able to start making skins for ipb3 even though I was making them for 2.3 and other forum scripts and cms's.
I actually bought the books so I could make cooler looking skins like you and dragonfly make.

[IBTheme]

awww, thank you for the compliment. :) (it's been a while, (since 2.3 actually) since I've heard too many compliments)
But if you're anything like me, those books will just confuse you more. LOL But I'm totally lovin' CSS3, I just wish all the
1400 browsers out there would get their act together and work with us here. :rolleyes:

One thing I can't deny, and I've been told this by sooo many people, it's a shame that we are not a team, because Dragonfly and I seem to have a very similar style and standard to our work. She's been doing this a little longer than I have, but I was doing web design and skinning for other bulletin boards before I stumbled on to IPB, so I guess having about the same amount of experience, both being girls, and both having high standards, so much of what we do seems like we have much in common. Someone said earlier to me today that it is sooo weird that she and I both started complaining at about the same time. I didn't even have a clue this thread existed until about 2 hours ago, but I was complaining on my own forums days ago. (((freaky)))

[skinbydragonfly]

Woops! Missed a closing tag:

<if test="avatar:|:$author['member_id'] AND $author['avatar']">

    <li class='avatar'><a href="{parse url="showuser={$author['member_id']}" template="showuser" seotitle="{$author['members_seo_name']}" base="public"}" title="{$this->lang->words['view_profile']}">{$author['avatar']}</a></li>

<else />

    <li class='avatar'><img src='{$this->settings['img_url']}/noavatar.png' alt=''></li>

</if>

Gosh but I must be dumb... it still ain't working >_< And.. yes I have got an image called noavatar.png in the style_images directory

<ul class='user_details'>

		<if test="avatar:|:$author['member_id'] AND $author['avatar']">

			<li class='avatar'><a href="{parse url="showuser={$author['member_id']}" template="showuser" seotitle="{$author['members_seo_name']}" base="public"}" title="{$this->lang->words['view_profile']}">{$author['avatar']}</a></li>

		<else />

			<li class='avatar'><img src='{$this->settings['img_url']}/noavatar.png' alt=''></li>

		</if>

We should get this split out I guess, but what the heck, it's my topic I can hijack it if I want :devil:

[Lewis P]

Well, in that case, it will be a PHP change. I know there are tutorials buzzing around (not that it helps you guys!)

Still, if that code is in the skin (by default, just without the image), I'd call it a semi-bug, as if there is no avatar, that line of code should be what it being processed, not something in the backend.

[IBTheme]

Thank You! (lewis & kim) I was so hoping someone would save me from feeling like a total idiot. Now I know it's not just me. (misery loves company) lol :P

[Michael]

For those who are trying the default avatar stuff, try using Firebug to inspect the element, see what it's trying to display. If you have a live example of it failing, point it out, we should be able to figure something out.

[skinbydragonfly]

Well, in that case, it will be a PHP change. I know there are tutorials buzzing around (not that it helps you guys!)

Still, if that code is in the skin (by default, just without the image), I'd call it a semi-bug, as if there is no avatar, that line of code should be what it being processed, not something in the backend.

Very true!

I just realised it is basically the same code (but I was using a macro) I tried in July of last year LOL

http://community.invisionpower.com/topic/289195-no-avatar-image-via-the-skin/page__p__1833733__fromsearch__1&#entry1833733

[Olivier Turbis]

Michael: it's pointing to a blank 1x1 pixel PNG image.

[IBTheme]

forums/public/style_avatars/blank_avatar.png (or something like that)

[Amy T]

We should all 3 be a team. 3 female skinners teaming up we could rule the world. :).

[IBTheme]

We should all 3 be a team. 3 female skinners teaming up we could rule the world. :).

Something I have hoped for, for a loooong time. I hate working alone.

[Michael]

That's probably something with gravatar then. I know it passes a parameter that gives a fallback image when the user has no gravatar image. Let me see if I can come up with anything for this.

[Lewis P]

We've just gone in a big circle. :D