[justify][sup]As an introduction: this thread is not only a "free fancypost" type thread, but also a resource for coders, to learn new techniques that are just now being discovered- to pioneer them, so to speak. All fancyposts placed here are free, but donations are much appreciated.
So, I've noticed that there is a fancypost that is rapidly becoming a much-loved fancypost style. this fancy is what people are calling a "photo-manipulated fancypost". From what I've seen, people create this fancypost using Gimp or Photoshop to manipulate an image and a bit of text to make it fade to a specific color, which then becomes the color of the text fancypost.
Now, what if you don't have Gimp or Photoshop? Then you have to go to somebody who does and ask them to make it for you, in which case you have to wait and/or pay. Then, you can't customize it, and so you have to request one per character / usage. That's no fun, is it? Especially for people who are used to making their own fancies.
Well, I decided to find a way to do it using only codes, and then make it public, so that if you wanted to, you could easily make a simple "photo-manipulated" fancy. Keep in mind that this is not going to be able to achieve everything that a fancypost made in Photoshop or Gimp could, but it will be simpler and less resource and time expensive.
[fancypost bgcolor=; bordercolor=white; background:url(http://assets.worldwildlife.or…Tiger-Hero.jpg?1345559303); background-size: 600px 380px; height: 200px; width: 500px; -moz-box-shadow: 0px -80px 100px -10px white inset; -webkit-box-shadow: 0px -80px 100px -10px white inset; box-shadow: 0px -80px 100px -10px white inset; background-position: 0px; 30px;][/fancypost][fancypost bgcolor=; bordercolor=transparent; height: 16px; width: 230px; margin-left: 54px; padding: 0px; margin-top: -38px; opacity: 0.6;][font=Brush Script MT][color=#AD6213][size=30px]TITLE[/fancypost][fancypost bgcolor=white; bordercolor=white; overflow: auto; min-height: 200px; width: 500px; margin-top: 20px;][justify][font=Berlin Sans FB][color=black][sup]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed felis urna, sodales ac neque vel, consequat sagittis urna. Cras mauris arcu, venenatis in iaculis eu, lacinia in velit. Phasellus a dapibus urna, vel volutpat felis. Maecenas id mollis massa. Fusce luctus mauris metus, quis mattis justo feugiat et. In varius felis tortor, id luctus ipsum consequat id. Fusce porta eleifend metus quis pharetra. Vivamus mauris diam, accumsan eu euismod at, sollicitudin sed purus. Fusce eros mi, accumsan eget erat non, faucibus dignissim mi. Vivamus viverra diam et nibh finibus, non congue erat congue. Nam nec lacinia ex, vel pellentesque augue.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc viverra ut neque sed iaculis. Aliquam id iaculis quam. Sed convallis ante at lacus condimentum volutpat. Cras ornare lacinia ex, at venenatis ante semper vitae. Nullam convallis libero nibh. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed tincidunt convallis lacinia. Pellentesque iaculis suscipit mi nec lacinia.
Morbi quis est id purus volutpat consectetur. Sed ultrices mattis nulla, rutrum sollicitudin elit tristique ac. Mauris purus enim, hendrerit sed viverra vel, consequat at erat. Cras viverra tellus eu lacus rhoncus, ut pharetra ipsum interdum. Cras ut sem imperdiet, finibus risus sit amet, sollicitudin erat. Maecenas fermentum neque quis velit fringilla, id blandit est dignissim. Ut rhoncus quam ligula, dapibus tristique leo posuere a. Integer vitae lacus dictum, cursus nulla quis, pulvinar sapien. Mauris vehicula mi sit amet tortor ullamcorper malesuada. Sed id volutpat nunc.
[abbr=used with permission, #SRsfancy]@softrain[/abbr][/fancypost]
[sup][nobbc][fancypost bgcolor=; bordercolor=white; background:url(http://assets.worldwildlife.or…Tiger-Hero.jpg?1345559303); background-size: 600px 380px; height: 200px; width: 500px; -moz-box-shadow: 0px -80px 100px -10px white inset; -webkit-box-shadow: 0px -80px 100px -10px white inset; box-shadow: 0px -80px 100px -10px white inset; background-position: 0px; 30px;][/fancypost][fancypost bgcolor=; bordercolor=transparent; height: 16px; width: 230px; margin-left: 54px; padding: 0px; margin-top: -38px; opacity: 0.6;][font=Brush Script MT][color=#AD6213][size=30px]TITLE[/fancypost][fancypost bgcolor=white; bordercolor=white; overflow: auto; min-height: 200px; width: 500px; margin-top: 20px;][justify][font=Berlin Sans FB][color=black][sup]text here
[abbr=used with permission, #SRsfancy]@softrain[/abbr][/fancypost][/nobbc]
[sup]so here we go. this fancypost is an entirely code-base template, meaning it requires no editing to be used, but can be edited and personalized based on your own personal taste. any image can be immediately inserted in and will automatically have the text overlaid, be sized to fit the header, and work with the fancypost. the fancypost has no scroll bar, allowing for the user to type as much as they want without the fancy gaining an annoying scroll bar. it will also not shrink below 200px. the credit is not to be removed or changed in any way, as it identifies the fancy as my creation. anything else may be changed.
[fancypost bgcolor=; bordercolor=transparent; background:url(http://assets.worldwildlife.or…MID_243238.jpg?1345548975); background-size: 600px 380px; height: 280px; width: 500px; margin-top: 20px;][/fancypost][fancypost bgcolor=; background: linear-gradient(transparent, white 90%); bordercolor=white; height: 285px; width: 500px; margin-top: -292px;][/fancypost][fancypost bgcolor=; bordercolor=transparent; height: 16px; width: 230px; margin-left: 54px; padding: 0px; margin-top: -38px; opacity: 0.6;][font=Brush Script MT][color=#AD6213][size=30px]TITLE[/fancypost][fancypost bgcolor=white; bordercolor=white; overflow: auto; min-height: 200px; width: 500px; margin-top: 20px;][font=Berlin Sans FB][color=black][sup]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed felis urna, sodales ac neque vel, consequat sagittis urna. Cras mauris arcu, venenatis in iaculis eu, lacinia in velit. Phasellus a dapibus urna, vel volutpat felis. Maecenas id mollis massa. Fusce luctus mauris metus, quis mattis justo feugiat et. In varius felis tortor, id luctus ipsum consequat id. Fusce porta eleifend metus quis pharetra. Vivamus mauris diam, accumsan eu euismod at, sollicitudin sed purus. Fusce eros mi, accumsan eget erat non, faucibus dignissim mi. Vivamus viverra diam et nibh finibus, non congue erat congue. Nam nec lacinia ex, vel pellentesque augue.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc viverra ut neque sed iaculis. Aliquam id iaculis quam. Sed convallis ante at lacus condimentum volutpat. Cras ornare lacinia ex, at venenatis ante semper vitae. Nullam convallis libero nibh. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed tincidunt convallis lacinia. Pellentesque iaculis suscipit mi nec lacinia.
Morbi quis est id purus volutpat consectetur. Sed ultrices mattis nulla, rutrum sollicitudin elit tristique ac. Mauris purus enim, hendrerit sed viverra vel, consequat at erat. Cras viverra tellus eu lacus rhoncus, ut pharetra ipsum interdum. Cras ut sem imperdiet, finibus risus sit amet, sollicitudin erat. Maecenas fermentum neque quis velit fringilla, id blandit est dignissim. Ut rhoncus quam ligula, dapibus tristique leo posuere a. Integer vitae lacus dictum, cursus nulla quis, pulvinar sapien. Mauris vehicula mi sit amet tortor ullamcorper malesuada. Sed id volutpat nunc.
[abbr=used with permission, #SRsfancy]@softrain[/abbr][/fancypost]
[justify][sup][nobbc][fancypost bgcolor=; bordercolor=transparent; background:url(http://assets.worldwildlife.or…MID_243238.jpg?1345548975); background-size: 600px 380px; height: 280px; width: 500px; margin-top: 20px;][/fancypost][fancypost bgcolor=; background: linear-gradient(transparent, white 90%); bordercolor=white; height: 285px; width: 500px; margin-top: -292px;][/fancypost][fancypost bgcolor=; bordercolor=transparent; height: 16px; width: 230px; margin-left: 54px; padding: 0px; margin-top: -38px; opacity: 0.6;][font=Brush Script MT][color=#AD6213][size=30px]TITLE[/fancypost][fancypost bgcolor=white; bordercolor=white; overflow: auto; min-height: 200px; width: 500px; margin-top: 20px;][font=Berlin Sans FB][color=black][sup]text here.
[abbr=used with permission, #SRsfancy]@softrain[/abbr][/fancypost][/nobbc]
[justify][sup]this fancypost is an entirely code-base template, meaning it requires no editing to be used, but can be edited and personalized based on your own personal taste. any image can be immediately inserted in and will automatically have the text overlaid, be sized to fit the header, and work with the fancypost. the fancypost has no scroll bar, allowing for the user to type as much as they want without the fancy gaining an annoying scroll bar. it will also not shrink below 200px. the credit is not to be removed or changed in any way, as it identifies the fancy as my creation. anything else may be changed.
despite looking exactly the same as the previous one, this has noticeable coding differences in the image-header bit. for example, this uses two overlaid fancyposts, and is simpler than the previous, though the first one offers much more flexibility in terms of the fade.
| [fancypost bgcolor=; bordercolor=transparent; background:url(http://cdn.iwastesomuchtime.co…21427148320120339183.jpeg); background-size: 400px 480px; background-position: -200px; height: 475px; width: 100px; margin-top: 0px; margin-right: -15px;][/fancypost][fancypost bgcolor=; background: linear-gradient(to right, transparent, white 90%); bordercolor=white; height: 475px; width: 100px; margin-top: -487px; margin-right: -15px;][/fancypost] | [fancypost bgcolor=#ffffff; border: none; overflow: hidden; height: 477px; width: 330px;] [color=#000000][sup]@softrain[fancypost bgcolor=; bordercolor=transparent; height: 485px; width: 340px; padding: 0px; overflow: hidden; margin-left: -8px; margin-top: -5px;][fancypost bgcolor=; bordercolor=transparent; width: 340px; height: 465px; padding: 0px;][fancypost bgcolor=; border: none; width: 340px; height: 465px; padding: 0px; overflow: hidden;][fancypost bgcolor=; bordercolor=transparent; overflow: auto; height: 445px; width: 340px; padding: 10px; margin-left: 0px;][justify][font=Berlin Sans FB][color=#000000][sup]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin convallis tellus porttitor lobortis elementum. Nunc tincidunt vel ex a venenatis. Integer blandit dignissim quam, quis pretium quam rutrum eu. Mauris ligula sapien, feugiat quis tempor eu, semper a mauris. Cras imperdiet felis ut interdum molestie. Ut maximus nulla vitae tempus porta. Nullam sit amet odio interdum, condimentum nibh ut, scelerisque dui. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque ac velit a velit cursus consectetur ut sed mauris. Aenean at augue at velit accumsan feugiat eu sed ante. Sed vel consectetur ipsum. Phasellus sollicitudin eu lorem sed dapibus. Donec lobortis dolor urna, blandit pellentesque dui egestas quis. Nullam in eros lacus. Aenean laoreet fermentum interdum. Sed vehicula vestibulum auctor. Sed rutrum, velit sed fermentum suscipit, purus lectus hendrerit libero, ac fringilla felis nisl molestie purus. Duis ut semper metus. Maecenas fermentum fringilla nisl, ut pharetra mi ornare ut. Integer rutrum neque id ipsum pharetra pulvinar. Aenean tortor elit, mollis et justo quis, mollis molestie tortor. Nulla consectetur nisi a vulputate lacinia. Fusce nec posuere quam. Quisque feugiat ex in magna convallis, quis sagittis augue facilisis. Cras elit velit, sodales rhoncus massa id, accumsan ultricies mi. Aliquam rutrum elit sem, sit amet accumsan sapien elementum vitae. Fusce faucibus ornare lectus vitae dictum. Morbi a ultricies nunc, a blandit lorem. Nunc ut turpis quis risus imperdiet molestie eu id purus. Cras cursus lobortis justo at mollis. Cras id augue eu arcu iaculis pulvinar non ac libero. Integer tempus ornare sem non tincidunt. Phasellus felis arcu, accumsan non tincidunt a, consequat vitae ipsum. Phasellus nec diam sed ex vestibulum luctus vel quis leo. Vestibulum luctus tortor nibh, vel molestie odio imperdiet a.[/fancypost][/fancypost][/fancypost][/fancypost][/fancypost] |
[justify][sup][nobbc][align=center]
| [fancypost bgcolor=; bordercolor=transparent; background:url(http://cdn.iwastesomuchtime.co…21427148320120339183.jpeg); background-size: 400px 480px; background-position: -200px; height: 475px; width: 100px; margin-top: 0px; margin-right: -15px;][/fancypost][fancypost bgcolor=; background: linear-gradient(to right, transparent, white 90%); bordercolor=white; height: 475px; width: 100px; margin-top: -487px; margin-right: -15px;][/fancypost] | [fancypost bgcolor=#ffffff; border: none; overflow: hidden; height: 477px; width: 330px;][align=center][color=#000000][sup]@softrain[fancypost bgcolor=; bordercolor=transparent; height: 485px; width: 340px; padding: 0px; overflow: hidden; margin-left: -8px; margin-top: -5px;][fancypost bgcolor=; bordercolor=transparent; width: 340px; height: 465px; padding: 0px;][fancypost bgcolor=; border: none; width: 340px; height: 465px; padding: 0px; overflow: hidden;][fancypost bgcolor=; bordercolor=transparent; overflow: auto; height: 445px; width: 340px; padding: 10px; margin-left: 0px;][justify][font=Berlin Sans FB][color=#000000][sup]text here [/fancypost][/fancypost][/fancypost][/fancypost][/fancypost] |
[/nobbc]
[sup]this fancypost is an entirely code-base template, meaning it requires no editing to be used, but can be edited and personalized based on your own personal taste. any image can be immediately inserted in and will automatically work with the fancypost. the fancypost has an invisible scroll bar, allowing for the user to type as much as they want without the fancy gaining an annoying scroll bar. it will also not shrink below or grow above 465px. the credit is not to be removed or changed in any way, as it identifies the fancy as my creation. anything else may be changed.