Embeddable Content (Instagram now available)

This forum is for Administrators to post news concerning the site and forums.
Post Reply
User avatar
zoraster
zoraster
He/Him
Disorganized Crime
User avatar
User avatar
zoraster
He/Him
Disorganized Crime
Disorganized Crime
Posts: 21680
Joined: June 10, 2008
Pronoun: He/Him
Location: Belmont, CA

Embeddable Content (Instagram now available)

Post Post #0 (ISO) » Sun Apr 19, 2015 4:32 am

Post by zoraster »

So I've been working on adding more embeddable content. My two requirements are:
1. It can't autoplay.
2. It can't autoplay.

I can't figure out how to get twitch videos not to autoplay (if you know the code to do this, please let me know).

Anyway, Vine videos are embeddable now. Find the identification code (a bunch of random letters) by clicking the "visit website" button and put that into [vine] tags.

Are there any other sites people want to see embedded? I'll look into it
.
User avatar
quadz08
quadz08
Jack of All Trades
User avatar
User avatar
quadz08
Jack of All Trades
Jack of All Trades
Posts: 5619
Joined: May 30, 2010
Location: where the wily things are

Post Post #1 (ISO) » Sun Apr 19, 2015 4:57 am

Post by quadz08 »

I'd imagine that instagram video would be a thing people would be interested in?
Current Avatar: Kronk. Duh.
User avatar
quadz08
quadz08
Jack of All Trades
User avatar
User avatar
quadz08
Jack of All Trades
Jack of All Trades
Posts: 5619
Joined: May 30, 2010
Location: where the wily things are

Post Post #2 (ISO) » Sun Apr 19, 2015 5:01 am

Post by quadz08 »

Current Avatar: Kronk. Duh.
User avatar
zoraster
zoraster
He/Him
Disorganized Crime
User avatar
User avatar
zoraster
He/Him
Disorganized Crime
Disorganized Crime
Posts: 21680
Joined: June 10, 2008
Pronoun: He/Him
Location: Belmont, CA

Post Post #3 (ISO) » Sun Apr 19, 2015 5:54 am

Post by zoraster »

gosh darnit. why is it doing that! i shall try to solve that.
.
User avatar
zoraster
zoraster
He/Him
Disorganized Crime
User avatar
User avatar
zoraster
He/Him
Disorganized Crime
Disorganized Crime
Posts: 21680
Joined: June 10, 2008
Pronoun: He/Him
Location: Belmont, CA

Post Post #4 (ISO) » Sun Apr 19, 2015 6:04 am

Post by zoraster »

hmm it seems like it autoplays without the sound on, which is at least better than twitch which starts up a whole big thing.
.
User avatar
zoraster
zoraster
He/Him
Disorganized Crime
User avatar
User avatar
zoraster
He/Him
Disorganized Crime
Disorganized Crime
Posts: 21680
Joined: June 10, 2008
Pronoun: He/Him
Location: Belmont, CA

Post Post #5 (ISO) » Sun Apr 19, 2015 6:20 am

Post by zoraster »

ahah! Fixed!
.
User avatar
zoraster
zoraster
He/Him
Disorganized Crime
User avatar
User avatar
zoraster
He/Him
Disorganized Crime
Disorganized Crime
Posts: 21680
Joined: June 10, 2008
Pronoun: He/Him
Location: Belmont, CA

Post Post #6 (ISO) » Sun Apr 19, 2015 7:33 am

Post by zoraster »

In post 1, quadz08 wrote:instagram


can you show me the location of an instagram video?
.
User avatar
quadz08
quadz08
Jack of All Trades
User avatar
User avatar
quadz08
Jack of All Trades
Jack of All Trades
Posts: 5619
Joined: May 30, 2010
Location: where the wily things are

Post Post #7 (ISO) » Sun Apr 19, 2015 8:54 am

Post by quadz08 »

i can't, I don't instagram

i just know that it's a thing some people do
Current Avatar: Kronk. Duh.
User avatar
Klingoncelt
Klingoncelt
Jack of All Trades
User avatar
User avatar
Klingoncelt
Jack of All Trades
Jack of All Trades
Posts: 7229
Joined: September 28, 2014
Location: Under A Raging Moon

Post Post #8 (ISO) » Sun Apr 19, 2015 2:49 pm

Post by Klingoncelt »

Just want to say, love your hair, Zoraster. It's
you
, dear.
Klingoncelt: "The whole scumteam slipped on page 1. It's the new meta. Sheep me because my reads are so accurate that whoever I name gets mod-converted to scum."
-
MiniDeathStar
User avatar
Psyche
Psyche
he/they
Survivor
User avatar
User avatar
Psyche
he/they
Survivor
Survivor
Posts: 10049
Joined: April 28, 2011
Pronoun: he/they

Post Post #9 (ISO) » Sun Apr 19, 2015 6:27 pm

Post by Psyche »

now that the list in the reply window isn't comprehensive it would be cool to have one somewhere that is
youtube playlist extracter | donbot | game scraper | vca | setupsim | strategist | llm
User avatar
zoraster
zoraster
He/Him
Disorganized Crime
User avatar
User avatar
zoraster
He/Him
Disorganized Crime
Disorganized Crime
Posts: 21680
Joined: June 10, 2008
Pronoun: He/Him
Location: Belmont, CA

Post Post #10 (ISO) » Mon Apr 20, 2015 1:26 am

Post by zoraster »

Spoiler: extensions
align= Edit Delete
anchor Edit Delete
anchor= Edit Delete
area Edit Delete
area= Edit Delete
card Edit Delete
cell Edit Delete
cell= Edit Delete
center Edit Delete
chess Edit Delete
clock= Edit Delete
float= Edit Delete
font= Edit Delete
go Edit Delete
goto Edit Delete
goto= Edit Delete
header Edit Delete
header= Edit Delete
heal Edit Delete
hoverimg= Edit Delete
hr Edit Delete
hurt Edit Delete
hurt2 Edit Delete
left Edit Delete
line Edit Delete
mech Edit Delete
mech= Edit Delete
mono Edit Delete
ooc Edit Delete
pre Edit Delete
reverse Edit Delete
right Edit Delete
row Edit Delete
s Edit Delete
smallcaps Edit Delete
spoiler Edit Delete
spoiler= Edit Delete
spotify Edit Delete
strike Edit Delete
sub Edit Delete
sup Edit Delete
tab Edit Delete
table Edit Delete
table= Edit Delete
test= Edit Delete
thumb= Edit Delete
twitch Edit Delete
unvote Edit Delete
user Edit Delete
uv Edit Delete
v Edit Delete
vine Edit Delete
vote Edit Delete
wiki Edit Delete
wiki= Edit Delete
youtube Edit Delete



Are the custom extensions. Not all are fully functional.
.
User avatar
Cheery Dog
Cheery Dog
Kayak
User avatar
User avatar
Cheery Dog
Kayak
Kayak
Posts: 8035
Joined: June 30, 2012
Location: OMG BALL!

Post Post #11 (ISO) » Mon Apr 20, 2015 3:46 am

Post by Cheery Dog »

I think the only ones of those I haven't seen/can't get to work are card, test= and clock=

I think I've seen thumb- before anyway. (I also have no idea how to use chess, but that doesn't concern me as I'm aware it is used)
Holder of the Longest Continuous Weekly Mafiascum Post Record. 1 July 2012 - 16 Feb 2023
*It may be held by someone else if you discount the major downtime in 2012 and 2014, I'm not doing the research.
User avatar
zoraster
zoraster
He/Him
Disorganized Crime
User avatar
User avatar
zoraster
He/Him
Disorganized Crime
Disorganized Crime
Posts: 21680
Joined: June 10, 2008
Pronoun: He/Him
Location: Belmont, CA

Post Post #12 (ISO) » Mon Apr 20, 2015 3:50 am

Post by zoraster »

thumb's description is: Shrink image: [thumb=width (in px)]image location[/thumb]

test looks like it's also about resizing images

Clock's html is: [clock={IDENTIFIER}]{NUMBER1},{NUMBER2}[/clock]
and the html is: <span style="size:200%; border:4px double black">{NUMBER1}<img src="/wiki/images/8/88/Colon.png">{NUMBER2} {IDENTIFIER}</span>

Card is totally empty.
.
User avatar
zoraster
zoraster
He/Him
Disorganized Crime
User avatar
User avatar
zoraster
He/Him
Disorganized Crime
Disorganized Crime
Posts: 21680
Joined: June 10, 2008
Pronoun: He/Him
Location: Belmont, CA

Post Post #13 (ISO) » Mon Apr 20, 2015 3:54 am

Post by zoraster »

also i tried to do a twitter embed, but the way those are embedded don't really lend themselves to an easy code.
.
User avatar
Marquis
Marquis
Survivor
User avatar
User avatar
Marquis
Survivor
Survivor
Posts: 11342
Joined: June 23, 2013
Location: EST (–5)

Post Post #14 (ISO) » Mon Apr 27, 2015 12:14 pm

Post by Marquis »

i do think instagram, at least for both pics and vids, would be just as if not more useful than vine.

https://instagram.com/p/1_jRQxjvAE video link example
https://instagram.com/p/1r4sDGDvKv img link example

Spoiler: for vid, html embed code given off the page
with caption

Code: Select all

<blockquote class="instagram-media" data-instgrm-captioned data-instgrm-version="4" style=" background:#FFF; border:0; border-radius:3px; box-shadow:0 0 1px 0 rgba(0,0,0,0.5),0 1px 10px 0 rgba(0,0,0,0.15); margin: 1px; max-width:658px; padding:0; width:99.375%; width:-webkit-calc(100% - 2px); width:calc(100% - 2px);"><div style="padding:8px;"> <div style=" background:#F8F8F8; line-height:0; margin-top:40px; padding:50% 0; text-align:center; width:100%;"> <div style=" background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACwAAAAsCAMAAAApWqozAAAAGFBMVEUiIiI9PT0eHh4gIB4hIBkcHBwcHBwcHBydr+JQAAAACHRSTlMABA4YHyQsM5jtaMwAAADfSURBVDjL7ZVBEgMhCAQBAf//42xcNbpAqakcM0ftUmFAAIBE81IqBJdS3lS6zs3bIpB9WED3YYXFPmHRfT8sgyrCP1x8uEUxLMzNWElFOYCV6mHWWwMzdPEKHlhLw7NWJqkHc4uIZphavDzA2JPzUDsBZziNae2S6owH8xPmX8G7zzgKEOPUoYHvGz1TBCxMkd3kwNVbU0gKHkx+iZILf77IofhrY1nYFnB/lQPb79drWOyJVa/DAvg9B/rLB4cC+Nqgdz/TvBbBnr6GBReqn/nRmDgaQEej7WhonozjF+Y2I/fZou/qAAAAAElFTkSuQmCC); display:block; height:44px; margin:0 auto -44px; position:relative; top:-22px; width:44px;"></div></div> <p style=" margin:8px 0 0 0; padding:0 4px;"> <a href="https://instagram.com/p/1_jRQxjvAE/" style=" color:#000; font-family:Arial,sans-serif; font-size:14px; font-style:normal; font-weight:normal; line-height:17px; text-decoration:none; word-wrap:break-word;" target="_top">Important lessons from today: 1) Sheep are impossible to reason with. 2) Sheep are rude.</a></p> <p style=" color:#c9c8cd; font-family:Arial,sans-serif; font-size:14px; line-height:17px; margin-bottom:0; margin-top:8px; overflow:hidden; padding:8px 0 7px; text-align:center; text-overflow:ellipsis; white-space:nowrap;">A video posted by Taylor Swift (@taylorswift) on <time style=" font-family:Arial,sans-serif; font-size:14px; line-height:17px;" datetime="2015-04-27T21:11:15+00:00">Apr 27, 2015 at 2:11pm PDT</time></p></div></blockquote>
<script async defer src="//platform.instagram.com/en_US/embeds.js"></script>

without caption

Code: Select all

<blockquote class="instagram-media" data-instgrm-version="4" style=" background:#FFF; border:0; border-radius:3px; box-shadow:0 0 1px 0 rgba(0,0,0,0.5),0 1px 10px 0 rgba(0,0,0,0.15); margin: 1px; max-width:658px; padding:0; width:99.375%; width:-webkit-calc(100% - 2px); width:calc(100% - 2px);"><div style="padding:8px;"> <div style=" background:#F8F8F8; line-height:0; margin-top:40px; padding:50% 0; text-align:center; width:100%;"> <div style=" background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACwAAAAsCAMAAAApWqozAAAAGFBMVEUiIiI9PT0eHh4gIB4hIBkcHBwcHBwcHBydr+JQAAAACHRSTlMABA4YHyQsM5jtaMwAAADfSURBVDjL7ZVBEgMhCAQBAf//42xcNbpAqakcM0ftUmFAAIBE81IqBJdS3lS6zs3bIpB9WED3YYXFPmHRfT8sgyrCP1x8uEUxLMzNWElFOYCV6mHWWwMzdPEKHlhLw7NWJqkHc4uIZphavDzA2JPzUDsBZziNae2S6owH8xPmX8G7zzgKEOPUoYHvGz1TBCxMkd3kwNVbU0gKHkx+iZILf77IofhrY1nYFnB/lQPb79drWOyJVa/DAvg9B/rLB4cC+Nqgdz/TvBbBnr6GBReqn/nRmDgaQEej7WhonozjF+Y2I/fZou/qAAAAAElFTkSuQmCC); display:block; height:44px; margin:0 auto -44px; position:relative; top:-22px; width:44px;"></div></div><p style=" color:#c9c8cd; font-family:Arial,sans-serif; font-size:14px; line-height:17px; margin-bottom:0; margin-top:8px; overflow:hidden; padding:8px 0 7px; text-align:center; text-overflow:ellipsis; white-space:nowrap;"><a href="https://instagram.com/p/1_jRQxjvAE/" style=" color:#c9c8cd; font-family:Arial,sans-serif; font-size:14px; font-style:normal; font-weight:normal; line-height:17px; text-decoration:none;" target="_top">A video posted by Taylor Swift (@taylorswift)</a> on <time style=" font-family:Arial,sans-serif; font-size:14px; line-height:17px;" datetime="2015-04-27T21:11:15+00:00">Apr 27, 2015 at 2:11pm PDT</time></p></div></blockquote>
<script async defer src="//platform.instagram.com/en_US/embeds.js"></script>
link in bio
User avatar
zoraster
zoraster
He/Him
Disorganized Crime
User avatar
User avatar
zoraster
He/Him
Disorganized Crime
Disorganized Crime
Posts: 21680
Joined: June 10, 2008
Pronoun: He/Him
Location: Belmont, CA

Post Post #15 (ISO) » Mon Apr 27, 2015 12:25 pm

Post by zoraster »

So the problem with the captions is that it's text. It's not just a link I can plug in. Remember it needs to grab all of the relevant information from something like:

or what not. To put it in the terms of the site it'd be [instagram]{SIMPLETEXT}[/instagram] but I'm not sure if that's sufficient. For example, the stuff you quote has a whole bunch of stuff about Taylor swift in it, and that's simply too much. That's the same problem I have with twitter's embed for that matter.
.
User avatar
zoraster
zoraster
He/Him
Disorganized Crime
User avatar
User avatar
zoraster
He/Him
Disorganized Crime
Disorganized Crime
Posts: 21680
Joined: June 10, 2008
Pronoun: He/Him
Location: Belmont, CA

Post Post #16 (ISO) » Mon Apr 27, 2015 12:29 pm

Post by zoraster »

honestly though with instagram photos I wonder how helpful it really is to embed since most are posting the photo and you can simply grab the image url and post it as an [img]
.
User avatar
Marquis
Marquis
Survivor
User avatar
User avatar
Marquis
Survivor
Survivor
Posts: 11342
Joined: June 23, 2013
Location: EST (–5)

Post Post #17 (ISO) » Mon Apr 27, 2015 12:47 pm

Post by Marquis »

ah, well. yeah the point of an instagram embed is to show the comment, likes, etc. info with it, with a way to like+comment from the embed box. that's pretty complicated soo yeah.

thanks anyway!
link in bio
User avatar
xRECKONERx
xRECKONERx
GD is my Best Man
User avatar
User avatar
xRECKONERx
GD is my Best Man
GD is my Best Man
Posts: 26087
Joined: March 15, 2009

Post Post #18 (ISO) » Wed Apr 29, 2015 2:44 am

Post by xRECKONERx »

green shirt thursdays
User avatar
zoraster
zoraster
He/Him
Disorganized Crime
User avatar
User avatar
zoraster
He/Him
Disorganized Crime
Disorganized Crime
Posts: 21680
Joined: June 10, 2008
Pronoun: He/Him
Location: Belmont, CA

Post Post #19 (ISO) » Wed Apr 29, 2015 10:32 am

Post by zoraster »

test

[instagram]https://instagram.com/p/1pxTSqg4Op/[/instagram]

[instagram]https://instagram.com/p/1_jRQxjvAE[/instagram]
.
User avatar
zoraster
zoraster
He/Him
Disorganized Crime
User avatar
User avatar
zoraster
He/Him
Disorganized Crime
Disorganized Crime
Posts: 21680
Joined: June 10, 2008
Pronoun: He/Him
Location: Belmont, CA

Post Post #20 (ISO) » Wed Apr 29, 2015 10:33 am

Post by zoraster »

so the instagram photo i put up worked, but not the video.
.
User avatar
chamber
chamber
Cases are scummy
User avatar
User avatar
chamber
Cases are scummy
Cases are scummy
Posts: 10703
Joined: November 20, 2005

Post Post #21 (ISO) » Wed Apr 29, 2015 11:45 am

Post by chamber »

You need to be careful about adding more embedded content. Too much embedded content destroys the load speed of pages. Just go to a page that has 4+ youtube videos, even without them auto-playing it destroys my browser. You need to add another stipulation to them loading if you want to expand the supported sites and thus their use. I would suggest some sort of mouse-over or onscreen check before loading the embedded content.
Taking a break from the site.
User avatar
zoraster
zoraster
He/Him
Disorganized Crime
User avatar
User avatar
zoraster
He/Him
Disorganized Crime
Disorganized Crime
Posts: 21680
Joined: June 10, 2008
Pronoun: He/Him
Location: Belmont, CA

Post Post #22 (ISO) » Wed Apr 29, 2015 11:52 am

Post by zoraster »

What do you mean?

I've never noticed youtube videos slowing things down. By far the worst for me is occasionally someone embeds a ridiculously large gif or something, but that's just a standard [img] tag. If it's not autoplaying, do the videos slow things down to the extent of their whole video loading?
.
User avatar
Psyche
Psyche
he/they
Survivor
User avatar
User avatar
Psyche
he/they
Survivor
Survivor
Posts: 10049
Joined: April 28, 2011
Pronoun: he/they

Post Post #23 (ISO) » Wed Apr 29, 2015 12:00 pm

Post by Psyche »

maybe autospoiler them?
youtube playlist extracter | donbot | game scraper | vca | setupsim | strategist | llm
User avatar
Marquis
Marquis
Survivor
User avatar
User avatar
Marquis
Survivor
Survivor
Posts: 11342
Joined: June 23, 2013
Location: EST (–5)

Post Post #24 (ISO) » Wed Apr 29, 2015 1:30 pm

Post by Marquis »

In post 19, zoraster wrote:test

[instagram]https://instagram.com/p/1pxTSqg4Op/[/instagram]

[instagram]https://instagram.com/p/1_jRQxjvAE[/instagram]

i just followed and unfollowed dan harmon all from a mafiascum thread

the world is a better place

also zor, would it be possible to have a size modifier thing on that - like with thumb, to make it 300 across?
link in bio
Post Reply

Return to “News”