y7kim / agency-jekyll-theme

Agency Theme for Jekyll

Agency Jekyll theme

Agency theme based on Agency bootstrap theme

How to use

###Portfolio

Portfolio projects are in '/_posts'

Images are in '/img/portfolio'

###About

Images are in '/img/about/'

###Team

Team members and info are in '_config.yml'

Images are in '/img/team/'

Demo

View this jekyll theme in action here

========= For more details, read documentation

agency-jekyll-theme's Issues

Template files loaded to FTP are displayed incorrectly

Hi, Rick!
First of all, thank you for such good looking template, great work!
I am not sure if it is actually issue of my lack of Jekyll knowledge, or actual problem.
When I am downloading Agency Theme and starting Jekyll - everything looks fine locally.
But when I am dragging files from _site folder to FTP, or making the same using glynn, I have that in browser:

Like some file is missing or broken. Any ideas on this?
Sorry for definitely noob question, web is not my main area.

Best regards,
Alex

doesnt build locally

I am very new to jekyll and ruby, cloned and installed requirements but, when I try to build it locally, I got this error:

Recommend just using forloop.index instead of requiring a modal-id property to be set for every post.

Using {{forloop.index}} instead of {{post.modal-id}} here:

agency-jekyll-theme/_includes/portfolio_grid.html

Line 13 in 0a9be6a

<a href="#portfolioModal{{ post.modal-id }}" class="portfolio-link" data-toggle="modal">

and here:

agency-jekyll-theme/_includes/modals.html

Line 3 in 0a9be6a

<div class="portfolio-modal modal fade" id="portfolioModal{{ post.modal-id }}" tabindex="-1" role="dialog" aria-hidden="true">

Will eliminate the need for set and track modal-id properties in every post that is created.

Contact box does not work.

The contact box gives an error message of 'Sorry , it seems that my mail server is not responding. Please try again later!' regardless of what is put in it!
This is true for the default email specified in the live demo as well!

Mistake in css img path?

To make every path relative, I guess the agency.css file shoud point to background images like so:

background-image: url(img/header-bg.jpg);

rather than

background-image: url(../img/header-bg.jpg);

same for the map-image.jpg file.

works locally but no on gh pages

Hey, I am encountering a problem with your theme.

So, when I run this theme locally with jekyll serve the styling and all works. But when I want to push it to my repository, the styling does not work properly. Here's a link: https://shadow2xx.github.io/yanickschlatter.github.io/

You have an idea?

Doesn't work with localhost

When I tried hosting the repo on my computer, the website is broken. Does it have something to do with the way the html files are coded?

Latest merge broke header image

Someone did an unsuccessful merge... 😛

3d94771#diff-8fcec8f1a92d88a9fcbb613904a9f5f2R269

I updated this theme! This one is outdated, see info below

raviriley/agency-jekyll-theme/

I wanted to use this theme but saw that this and SotiriosVrachas's versions are both outdated and not maintained, so I decided to convert the newest Bootstrap code to a Jekyll theme from scratch. Then, once I started using the theme, I realized I could make some additions to make the original theme more useful, such as Google Analytics support, an actually functional contact form, customizable styling, etc.
Check out the details here!

Center 2 team members

Hi there—love this theme, and pretty new to Jekyll, but can you give me any tips on how to center the two images when I only have two people in a team?

_posts not rendering, doesn't seem to register model-id

I tried creating a new markdown file in the _posts directory, but when rendering with github pages, all the sample projects are rendering correctly except mine. It seems that my "project" is not assigned a modal-id during build.
``

title: Choiceversial
subtitle: Mobile Development
layout: default
modal-id: 1
date: 2020-05-27
img: dreams.png
thumbnail: dreams-thumbnail.png
alt: image-alt
project-date: May 2020
client: Personal
category: Mobile Development
description: Choiceversial is a mobile app project made with React Native for cross-platform publishing. It's an application
that makes you react on controversial subjects, it also takes all the results in a database through a web api to make clear statistics based
on the country of the player.
Skills developed

1. Javascript with React Native
2. PostgreSQL database
3. Local database hosting
4. RESTApi with Django(Python)

---

``

img

The link from the returns #portfolioModal with no ids

Thanks!

PayPal button does not work

Fully tested and working Paypal button (which is a form) does not work in the theme. Turning of the contact_me.js file fixes the problem.

Mail server not responding

Hello, I am not too familiar with code and stuff but I have a website and a contact from, I used a template from bootstrap, I have added a few custom feilds such as drop downs and a tick bot to accept terms and conditions anyway, the problem is when I submit it, it says there is a error with my mail server. I will add my contact form code, and the contact_me.php found in the bin file. Hope someone can help.

`<?php
// check if fields passed are empty
if(empty($_POST['name']) ||
empty($_POST['phone']) ||
empty($_POST['email']) ||
empty($_POST['package'])
empty($_POST['message'])
empty($_POST['tandc']) ||
!filter_var($_POST['email'],FILTER_VALIDATE_EMAIL))
{
echo "No arguments Provided!";
return false;
}

$name = $_POST['name'];
$phone = $_POST['phone'];
$package = $_POST['package'];
$message = $_POST['message'];
$tandc = $_POST['tandc'];

// create email body and send it
$to = '[email protected]'; // PUT YOUR EMAIL ADDRESS HERE
$email_subject = "Request For: $name"; // EDIT THE EMAIL SUBJECT LINE HERE
$email_body = "You have received a new message from your website's contact form.\n\n"."Here are the details:\n\nName: $name\n\nPhone: $phone\n\nEmail: $email_address\n\nMessage:\n$message\n\ntandc\n\nPackage: $package\n";
$headers = "From: [email protected]\n";
$headers .= "Reply-To: $email_address";
mail($to,$email_subject,$email_body,$headers);
return true;
?>

<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="SimpltHost Request a server.">
<meta name="author" content="Thomas Wilson">
<link rel="icon" href="favicon.png">

<title>Request</title>

<!-- Bootstrap Core CSS -->
<link href="css/bootstrap.min.css" rel="stylesheet">

<!-- Custom CSS -->
<link href="css/modern-business.css" rel="stylesheet">

<!-- Custom Fonts -->
<link href="font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">

<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
    <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->

<!-- Navigation -->
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
    <div class="container">
        <!-- Brand and toggle get grouped for better mobile display -->
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand" href="index.html">Simply Host</a>
        </div>
        <!-- Collect the nav links, forms, and other content for toggling -->
        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
            <ul class="nav navbar-nav navbar-right">
                 <li>
                    <a href="index.html">Home</a>
                </li>
                <li>
                    <a href="order.html">Order</a>
                </li>

                    </ul>
                </li>
            </ul>
        </div>
        <!-- /.navbar-collapse -->
    </div>
    <!-- /.container -->
</nav>

<!-- Page Content -->
<div class="container">

    <!-- Page Heading/Breadcrumbs -->
    <div class="row">
        <div class="col-lg-12">
            <h1 class="page-header">Request</h1>
            <ol class="breadcrumb">
                <li><a href="order.html">Order</a>
                </li>
                <li class="active">Request</li>
            </ol>
        </div>
    </div>
    <!-- /.row -->

    <!-- Content Row -->
    <div class="row">
        <!-- Contact Details Column -->
        <div class="col-md-4">
            <h3>Problem?</h3>
            <p>
                Do you have a problem? Please tell us.<br>
            </p>
            <p><i class="fa fa-envelope-o"></i> 
                <abbr title="Email">E</abbr>: <a href="mailto:[email protected]">[email protected]</a>
            </p>
            <p><i class="fa fa-clock-o"></i> 
                <abbr title="Hours">H</abbr>: Monday - Friday: 8:00AM - 7:00PM (GMT)</p>
                <p> Saturday: 9:00AM - 8:00PM (GMT)</p>
                <p> Sunday: <strong>Support is Closed</strong></p>
        </div>
    </div>
    <!-- /.row -->

    <!-- Contact Form -->
    <!-- In order to set the email address and subject line for the contact form go to the bin/contact_me.php file. -->
    <div class="row">
        <div class="col-md-8">
            <h3>Request a Package</h3>
            <form name="sentMessage" id="contactForm" novalidate>
                <div class="control-group form-group">
                    <div class="controls">
                        <label>Full Name:</label>
                        <input type="text" class="form-control" id="name" required data-validation-required-message="Please enter your name.">
                        <p class="help-block"></p>
                    </div>
                </div>
                <div class="control-group form-group">
                    <div class="controls">
                        <label>Phone Number:</label>
                        <input type="tel" class="form-control" id="phone" required data-validation-required-message="Please enter your phone number.">
                    </div>
                </div>
                <div class="control-group form-group">
                    <div class="controls">
                        <label>Email Address:</label>
                        <input type="email" class="form-control" id="email" required data-validation-required-message="Please enter your email address.">
                </div>  
                    </div>
                <div class="control-group form-group">
                    <div class="controls">
                        <div class="form-group">
                            <label for="sel1">Package</label>
                            <select class="form-control" id="sel1" required data-validation-required-message="Please select a package.">>
                            <option>Teamspeak: Bronze</option>
                            <option>Teamspeak: Silver</option>
                            <option>Teamspeak: Gold</option>
                            <option>Minecraft: Bronze</option>
                            <option>Minecraft: Silver</option>
                            <option>Minecraft: Gold</option>
                            <option>Web Hosting: Dirt</option>
                            <option>Web Hosting: Bronze</option>
                            <option>Web Hosting: Silver</option>
                            <option>Web Hosting: Gold</option>
                            </select>
                        </div>
                    </div>
                </div>
                <div class="control-group form-group">
                    <div class="controls">
                        <label>Address:</label>
                        <textarea rows="10" cols="100" class="form-control" id="message" required data-validation-required-message="Please enter your address" maxlength="999" style="resize:none"></textarea>
                    </div>
                </div>
                <div class="control-group form-group">
                    <div class="controls">
                    <label class="checkbox-inline"><input type="checkbox" id="tandc" required data-validation-required-message="You need to accept the terms and conditions">I accept the <a href="termsandconditions.html">terms and conditions</a></label>
                <br>
                <br>


                <div id="success"></div>
                <!-- For success/fail messages -->
                <button type="submit" class="btn btn-primary">Request</button>
            </form>
        </div>

    </div>
    <!-- /.row -->

    <hr>

    <!-- Footer -->
    <footer>
        <div class="row">
            <div class="col-lg-12">
                <p>Copyright &copy; Simply Host 2016</p>
                <p>Site Version: 0.4</p>
            </div>
        </div>
    </footer>

</div>
<!-- /.container -->

<!-- jQuery -->
<script src="js/jquery.js"></script>

<!-- Bootstrap Core JavaScript -->
<script src="js/bootstrap.min.js"></script>

<!-- Contact Form JavaScript -->
<!-- Do not edit these files! In order to set the email address and subject line for the contact form go to the bin/contact_me.php file. -->
<script src="js/jqBootstrapValidation.js"></script>
<script src="js/contact_me.js"></script>

`

portfolio order

Mobile view

Hello, great theme, thanks a lot!
However, when I run the website on my phone, it appears smaller or part of the writting is cut off. Do you have any idea why this is happening?
Thank you in advance!

Trying to set up a page for an organisation but failing

Hi,

I am trying to set up a page for an organisation here. The webpage is present at the root, so I have modified my config.yml file like so:

url: https://alqaws.github.io
#baseurl: https://alqaws.github.io

But when I try visiting the webpage, I cannot reach it

Any pointers, please?

Allow Different Clients and Services in modals.html

Hi,

I am fairly new to web design and jekyll, but I am wondering if I am missing something. It looks like there is only one client with a link to start bootstrap that automatically appears for each project, even if you edit the posts markdown files. How can I customize each modal for different clients?

Thanks!

Dave

cannot include google analytics tracking code

I'm curious how i should add the tracking code. I put it under head.html before closing the but with no success. Any one could share how you make it work?

Thanks.

Email Form

Hello!

I'm using your theme and it is great. However, I've run into one final poblem with the email form. I get the error "Sorry , it seems that my mail server is not responding. Please try again later!" I am not sure where the problem is coming from... I've tried changing the email in the _config.yml and contact_me.php, to no avail. I'm new to this, so perhaps there is something wrong with my setup. Any thoughts?

Contact form

I'm using this theme on Github page, everything works but the contact form. I have read the solution proposed here #14 using formspree.io but the ajax method is in the premium package now, do you guys know some alternatives and solution?

Thank you !

above the fold non-blocking css

Hi,
Do you have any tips on the best way to extract above the fold css so that it can be inlined? I've been hacking on your template quite a bit for my personal website (WIP) and was trying to get my google page speed test improved. However, between the janky, partial bootstrap.css yoinked from bootswatch and the lengthy agency.css file, it's quite challenging to follow the css style cascade. Do you have any tips? Eventually I think it would be nice to extract the critical css styles into their own critical.css file which could be included via liquid in head.html (between <style> tags) and also in the main style.css which could then use and asynchronous deferred load

Replace static img: in "Posts" with other content?

Hi there,

Super new to CSS / Ruby / etc, so sorry if this is a dumb question.

I'm working on a video / audio-centric portfolio site using this template for Jekyll. I would like to be able to use a video or audio embed on the portfolio posts instead of a static image. In the code for the page you have :

img: dreams.png
thumbnail: dreams-thumbnail.png

How would one implement, let's say, a Vimeo embed code here instead of the "img: " bit?

Thanks!

-jeremy

Agency - Portfolio Grid Modal Order

Hello, Thanks for sharing this elegant template.

Can you explain why the portfolio grid shows modals in the order of 1-3, then the second row 6, 4, 5?

I looked at the post names/dates and they all seem in order so I can't figure out why they present this way.

Thanks for your time.
Dawn

Navbar doesn't appear fast enough

I noticed an issue with navbar on the demo example (and later on my own website).
The transition to "Services" when scrolled down by mouse or by keyboard arrows is not smooth enough.

I believe the issue is that it doesn't disappear fast enough.
Check out my screenshot: NavBar covers the Header.

Compare it with original Bootstrap theme:

Change links at Portfolio previews

Hello, everyone!
Now, after files are generated, links at Portfolio previews are point to bootstrap site.
It is possible to change them by hands in generated .html files, but is there a way to set links before generation in posts .md or some config files?

Best regards,
Alex

Migrate Portfolio to Jekyll Collections

This theme is wonderful. Thanks for putting it together. Now that Jekyll supports Collections I wanted to open this issue to earmark Collection use for Portfolio items.

Colors configuration doesnt work...

Because of this commit: 730995b

The "variables path" was changed from site.color.primary to site.data.template.color.primary and that was not reflected on _includes/css/bootstrap.min.css ...

I've noticed that because the form submission success message did not had a background color....

I will send a simple PR that replaces site.color.primary by site.data.template.color.primary...

Agency

To try on moving gears

Website rendering incorrectly

I forked the agency-jekyll-theme repo and I'm attempting to view the website at https://tillykrishna.github.io/, but I can't get the website to render as it does in the demo. This is what I'm currently getting:

In my _config.yml, I have:

url: https://tillykrishna.github.io
baseurl: /agency-jekyll-theme/

Is there something else I'm missing? Thanks so much!

Doesn't build

I tried cloning this and running jekyll serve, but it looks like the Gemfile is missing?

social icons do not show on chrome

differences between jekyll theme and bootstrap theme

I noticed one of the main differences between the bootstrap theme and the jekyll theme has to do with some of the 3rd party libraries/elements the agency theme uses. In particular I am referring to font-awesome and bootstrap. AFAICT font-awesome has been left completely in tact. However, it appears that this is not the case for bootstrap. In particular, bootstrap.css (or the minified version) appears to have been yoinked from bootswatch. I have two questions about this:

1. What was the motivation for using the bootswatch version? Was it simply to cut down on the amount of bootstrap assets needed, and slim down the site?

2. Would getting rid of the bootswatch version and replacing it with vanilla bootstrap be liable to cause any issues? I am thinking that it might be worthwhile to use grunt or gulp to automate building of the site (rather than having github do it for me) so that I can minify things (for speed) and also have better management of 3rd party packages via bower or npm.

How to show python projects in _posts

Hello, I tried converted my python projects to markdown as well as in html and uploaded in the posts section with the correct Date-Project.html Format, but when I click the project link in the webpage, the modall does not render the code. Pls help

Doesn't build?

Hi,

This might not really be an issue with the theme as such, but I can't seem to get this to render properly on gh-pages. Any thought's as of why this might be. Does the setup require me to do anything special?

https://danielsunden.github.io/Portfolio-New/

Investigate posible merge with https://github.com/SotiriosVrachas/jekyll-theme-startbootstrap-agency

https://github.com/SotiriosVrachas/jekyll-theme-startbootstrap-agency is based on Bootstrap 4 version of Start Bootstrap - Agency

Can't change the icons on services page

I'd like to change the images on the services page and replace them with my own, but I can't seem to find where they are located or how to change them. They seem to invisible in the code and files and yet they show up.

Your theme is listed in jekyllthemes.ru

Your theme has been listed on http://jekyllthemes.ru

vendor links aren't resolving

Am I doing something obviously wrong here?

Thanks.

Gemfile

source "https://rubygems.org"
# Hello! This is where you manage which Jekyll version is used to run.
# When you want to use a different version, change it below, save the
# file and run `bundle install`. Run Jekyll with `bundle exec`, like so:
#
#     bundle exec jekyll serve
#
# This will help ensure the proper Jekyll version is running.
# Happy Jekylling!
# gem "jekyll", "~> 4.3.2"

# This is the default theme for new Jekyll sites. You may change this to anything you like.
gem "agency-jekyll-theme", "~> 1.0"

# If you want to use GitHub Pages, remove the "gem "jekyll"" above and
# uncomment the line below. To upgrade, run `bundle update github-pages`.
gem "github-pages", group: :jekyll_plugins
# If you have any plugins, put them here!
group :jekyll_plugins do
  gem "jekyll-feed", "~> 0.12"
end

# Windows and JRuby does not include zoneinfo files, so bundle the tzinfo-data gem
# and associated library.
platforms :mingw, :x64_mingw, :mswin, :jruby do
  gem "tzinfo", ">= 1", "< 3"
  gem "tzinfo-data"
end

# Performance-booster for watching directories on Windows
gem "wdm", "~> 0.1.1", :platforms => [:mingw, :x64_mingw, :mswin]

# Lock `http_parser.rb` gem to `v0.6.x` on JRuby builds since newer versions of the gem
# do not have a Java counterpart.
gem "http_parser.rb", "~> 0.6.0", :platforms => [:jruby]

# https://github.com/jekyll/jekyll/issues/8523
gem "webrick"

Config

# Welcome to Jekyll!
#
# This config file is meant for settings that affect your whole blog, values
# which you are expected to set up once and rarely edit after that. If you find
# yourself editing this file very often, consider using Jekyll's data files
# feature for the data you need to update frequently.
#
# For technical reasons, this file is *NOT* reloaded automatically when you use
# 'bundle exec jekyll serve'. If you change this file, please restart the server process.
#
# If you need help with YAML syntax, here are some quick references for you:
# https://learn-the-web.algonquindesign.ca/topics/markdown-yaml-cheat-sheet/#yaml
# https://learnxinyminutes.com/docs/yaml/
#
# Site settings
# These are used to personalize your new site. If you look in the HTML files,
# you will see them accessed via {{ site.title }}, {{ site.email }}, and so on.
# You can create any custom variable you would like, and they will be accessible
# in the templates via {{ site.myvariable }}.

title: Your awesome title
email: [email protected]
description: >- # this means to ignore newlines until "baseurl:"
  Write an awesome description for your new site here. You can edit this
  line in _config.yml. It will appear in your document head meta (for
  Google search results) and in your feed.xml site description.
baseurl: "" # the subpath of your site, e.g. /blog
url: "" # the base hostname & protocol for your site, e.g. http://example.com
twitter_username: jekyllrb
github_username:  jekyll

# Build settings
theme: agency-jekyll-theme 
plugins:
  - jekyll-feed

# Exclude from processing.
# The following items will not be processed, by default.
# Any item listed under the `exclude:` key here will be automatically added to
# the internal "default list".
#
# Excluded items can be processed by explicitly listing the directories or
# their entries' file path in the `include:` list.
#
# exclude:
#   - .sass-cache/
#   - .jekyll-cache/
#   - gemfiles/
#   - Gemfile
#   - Gemfile.lock
#   - node_modules/
#   - vendor/bundle/
#   - vendor/cache/
#   - vendor/gems/
#   - vendor/ruby/

Logs

❯ jekyll serve --incremental
Configuration file: ~/Code/my_project/my_project.github.io/_config.yml
To use retry middleware with Faraday v2.0+, install `faraday-retry` gem
            Source: ~/Code/my_project/my_project.github.io
       Destination: ~/Code/my_project/my_project.github.io/_site
 Incremental build: enabled
      Generating... 
       Jekyll Feed: Generating feed for posts
                    done in 0.178 seconds.
 Auto-regeneration: enabled for '~/Code/my_project/my_project.github.io'
    Server address: http://127.0.0.1:4000/
  Server running... press ctrl-c to stop.
[2023-05-02 14:29:25] ERROR `/vendor/font-awesome/css/font-awesome.min.css' not found.
[2023-05-02 14:29:25] ERROR `/vendor/bootstrap/css/bootstrap.min.css' not found.
[2023-05-02 14:29:25] ERROR `/vendor/jquery/jquery.min.js' not found.
[2023-05-02 14:29:25] ERROR `/vendor/bootstrap/js/bootstrap.min.js' not found.
[2023-05-02 14:29:25] ERROR `/favicon.ico' not found.

Does this work with Git Pages?

Thinking of using this template as it is lovely, but not all Jekyll blogs can be hosted there.

Thanks!