Embed de conteúdo

[Tiago Vieira]

Ola a todos,

O cliente esta querendo colocar um código embed no site dele, para que usuários possam pegar o código e colocar as citações que estão no site dele.

O problema esta sendo o height do iframe que estamos gerando com o conteúdo, pois tem citações maiores que outras e estava pesquisando sobre o height automático de acordo com o conteúdo do iframe, porém não encontrei nada sobre isso que funcionasse aqui para mim.

Tem alguma coisa em jquery que possa ser feito nesse sentido?

Obrigado desde já.

Tiago Vieira

http://www.tvieira.net

[André Santos]

Acho que o único jeito é utilizando javascript no site dos usuários: http://stackoverflow.com/questions/9975810/make-iframe-automatically-adjust-height-according-to-the-contents-without-using

Você pode isolar esse script num arquivo no seu server, e disponibilizar um include dele juntamente com o código do iframe.

Abs,

--
--
Grupo de jQuery Brasil.
 
REGRAS: https://docs.google.com/document/d/1VfvTDmeHTSj-L5ouZJjQQ4OkjTCU1Hr2XtPYBNGVHH4/edit
 
USE O JSBIN.COM / JSFIDDLE.NET PARA CÓDIGOS.
 
Email: jque...@googlegroups.com
Biba: jquery-br+...@googlegroups.com
Site: http://groups.google.com/group/jquery-br?hl=pt-BR

---
Você recebeu essa mensagem porque está inscrito no grupo quot;jQuery (Brasil)" dos Grupos do Google.
Para cancelar inscrição nesse grupo e parar de receber e-mails dele, envie um e-mail para jquery-br+...@googlegroups.com.
Para mais opções, acesse https://groups.google.com/d/optout.

--
- André O. Santos -

"Os eruditos são aqueles que leram nos livros; mas os pensadores, os gênios, os iluminadores do mundo e os promotores do gênero humano, são aqueles que leram diretamente no livro do mundo." (Arthur Schopenhauer)

[Tiago Vieira]

Obrigado André,

Me indicaram também o http://davidjbradshaw.github.io/iframe-resizer/ mas terá que ter um script no site do usuário que for usar o embed.

Estou vendo se tem alguma coisa que não precisa de script no usuário, como o YouTube faz.

Obrigado

[Rafael Sirotheau]

Que tal passar um atributo no iframe com a altura? O YouTube faz assim. Ele não faz um resize automático. Os dados de largura e altura são passados nos atributos do iframe (height e width).

Sendo assim, antes de gerar o código de embed, calcule a altura necessária praquele iframe e gere o código de incorporação já com os atributos corretos.

Abraço,

Rafael Sirotheau
@rafasirotheau
/rafasirotheau

Linkedin

Front-end Developer
+55 (11) 9 6452 1384

[Tiago Vieira]

Sim, mais o maior problema esta sendo saber o height disso, sendo que são citações, isso varia muito. Teria que ser alguma coisa dinâmica, como o conteúdo da citação de enquadrar dentro do tamanho do iframe.

Obrigado

Tiago Vieira

http://www.tvieira.net

[Rafael Sirotheau]

Mas o embed não é apenas de uma citação? Qual seria exatamente o conteúdo desse embed? Por que, se for só uma citação, basta calcular a altura da div que vai ser embedada. Não rola um exemplo da estrutura do conteúdo que vai ser embedado em um jsfiddle da vida?

[Tiago Vieira]

Sim, mas serão citações diferentes. O que vai ser é que terá uma lista de citações e o usuário poderá pegar o código embed para colocar no seu site, para aparecer um determinada citação, e de uma para outra citação, o conteúdo é maior ou menor. O link abaixo tem o exemplo do que será "embedado" no site:

http://citacoessud.com.br/embed/1PBv

Obrigado

Tiago Vieira

http://www.tvieira.net

[André Santos]

Mas uma vez que o usuário gera o embed, será exibido sempre a mesma citação dentro dele?

Se for isso e se a largura for fixa, você podia gerar o html disso "escondido" na sua página (em uma div com posição absoluta fora da tela, por exemplo) e via javascript pegar a altura desse conteúdo e colocar no embed. Mas pelo exemplo que você mandou (com o layout responsivo) não vai funcionar, a menos que na hora de gerar o embed o usuário escolha a largura (e aí vc a usa a largura que ele escolheu na div escondida e pega a nova altura).

Outra solução (mas que foge um pouco do que vc quer) é disponibilizar apenas um javascript para o usuário inserir no site, e nesse script você pega o ID da citação e gera o html dinamicamente.

Abs,

[Rafael Sirotheau]

Passar um javascript acho que não foge não, e, na verdade, pode ser a melhor solução.

Podes utilizar um arquivo em, por exemplo, PHP, mas, que na verdade, tem cabeçalho e conteúdo de um JS. Esse conteúdo é gerado dinamicamente de acordo com os parâmetros passados, e, dessa forma, vai te permitir acessar o html do usuário. Não sei se fui claro... hehehe


Abraço,

[Tiago Vieira]

Acredito que estou quase pegando a ideia....rsrsrs

Alguem tem algum exemplo de algo parecido?

Obrigado

[Rafael Sirotheau]

Seria algo assim:

http://jsfiddle.net/rafasirotheau/nF9Z3/1/

Claro, você precisa testar isto em um ambiente com PHP.

Abraço,

[André Santos]

Esse solução do Rafael resolve, mas eu faria um pouco diferente:

- Você chama um script passando o ID da citação (script.js?id=123, por exemplo);
- Com esse ID, você executa um Ajax para o arquivo php que retorna a citação (usando jsonp);
- Com o json de retorno desse ajax, você monta o html que nem no exemplo do Rafael.

Eu acho que assim fica mais organizado, mas gera uma requisição a mais do que fazer tudo num php com o content-type alterado. Aí tem que ver se vale a pena.

Abs,

[Tiago Vieira]

Ola pessoal, desculpa a demora para responder, mas esses dias estão muito corridos.

Gostei das soluções, vou procurar como posso fazer como o André Santos passou, vou pesquisar para ver por onde eu posso começar.

Obrigado a todos

Tiago Vieira

http://www.tvieira.net