Uw Kickstarter belooft een Jekyll-site

Gepubliceerd op 27 februari 2016 • 2 min leestijd • 244 woorden

Link gekopieerd naar clipboard

Voor onze familiewebsite wilde ik een pagina maken met al mijn toezeggingen op Kickstarter. Omdat ik de juiste plug-in voor Jekyll niet kon vinden, heb ik…

Inhoudsopgave

Voor onze familiewebsite wilde ik een pagina maken met al mijn toezeggingen op Kickstarter.

Omdat ik de juiste plug-in voor Jekyll niet kon vinden, heb ik deze zelf gemaakt.
Het was mijn eerste poging met Ruby, dus misschien zijn sommige dingen niet zo goed als ze kunnen zijn. Als je zulke dingen tegenkomt, laat het me dan weten.

Wat het doet

De plug-in haalt de informatie op uit Kickstarter, inclusief bijbehorende afbeeldingen. De gegenereerde html ziet er als volgt uit:

Ga naar famelsinga.nl om de resulterende pagina te bekijken.

Styling

Als u de uitvoer wilt opmaken, kunt u de volgende klassen in CSS gebruiken:

div	doel
kickstartcontainer	de DIV die alle gegenereerde Kickstarter-informatie bevat
kickstart	de DIV die het project bevat
kickstartimg	voor het opmaken van de div die de afbeelding bevat
kickstarttekst	Als je de tekst wilt opmaken, kun je deze klasse

De Kickstarter-plug-in

ruby
require 'rubygems'
require 'nokogiri'
require 'open-uri'

module Jekyll
  class Kickstarter < Liquid::Tag

    def initialize(tag_name, text, tokens)
      super
      @text = text
    end

    def render(context)
      encoded_url=URI.encode("https://www.kickstarter.com/profile/" << @text)
      page = Nokogiri::HTML(open(encoded_url))
      projects=page.css('div.project-card-mini-wrap')
      tmp=projects.length-1
      a="<div class="kickstartcontainer">"
      (0..tmp).each do |count|
        a << "<div class="kickstart"><div class="kickstartimg"><a target='blank' href='https://kickstarter.com" << projects[count].css('a')[0]['href'] << "'><img src=""
        a << projects[count].css('a').css('img')[0]['src']
        a << "" /></a></div>"
        a << "<div class="kickstarttext">"
        a << "<a target='blank' href='https://kickstarter.com" << projects[count].css('a')[0]['href'] << "'><b>" << projects[count].css('div.project_name.h5.bold')[0].text.strip << "</b></a>"
        a << "<p>" << projects[count].css('a').css('p').text << "</p>"
        a << "</div>"
        a << "</div>"
      end
      a << "</div>"
      "#{a}"

    end
  end
end

Liquid::Template.register_tag('kickstarter', Jekyll::Kickstarter)