Coder Social home page Coder Social logo

quick-portfolio's Introduction

Developer Portfolio Landing Page Template

Introduction

Use this template if you need a quick developer / data science portfolio! Based on a Minimal Jekyll theme for GitHub Pages.

Installation

See full step by step tutorial on Medium.


You can use the editor on GitHub to maintain and preview the content for your website in Markdown files.

Whenever you commit to this repository, GitHub Pages will run Jekyll to rebuild the pages in your site, from the content in your Markdown files.

Markdown

Markdown is a lightweight and easy-to-use syntax for styling your writing. It includes conventions for

Syntax highlighted code block

# Header 1
## Header 2
### Header 3

- Bulleted
- List

1. Numbered
2. List

**Bold** and _Italic_ and `Code` text

[Link](url) and ![Image](src)

For more details see GitHub Flavored Markdown.

Roadmap

See the open issues for a list of proposed features (and known issues).


References

[1] Jekyll theme "Minimal" for GitHub Pages: https://github.com/pages-themes/minimal (CC0 1.0 Universal License)
[2] Dummy photo via: https://pixabay.com/photos/man-male-adult-person-caucasian-1209494/ (Pixabay License)
[3] Dummy thumbnail image created by rawpixel.com: https://www.freepik.com/free-vector/set-elements-infographic_2807573.htm (Standard Freepik License)

quick-portfolio's People

Contributors

907sjl avatar ayushabrol13 avatar evanca avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

quick-portfolio's Issues

Add embedded video example

Embedded Video
Added _includes folder with iframe HTML template.

Video can be linked by using "{% include youtube.html id="enter the youtube ID here" %}"

Credit Christian Heilmann
Posted on September 14, 2022 here

An example video can be found at the bottom of this page: https://gregorywmorris.github.io/sample_page

folder:
_includes

youtube.html :

`

<iframe width="640" height="390" src="https://www.youtube.com/embed/{{ include.id }}" frameborder="0" allowfullscreen></iframe>
<style> .embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } </style> `

Index.html needed, Page not found

After commit the zip file to the repository I made for the site, after clicking on the linking I am routed to a 404 Error. Apparently I need a index.html

footer can cause the page too compact

Thank you very much for your work. But I found the existence of that footer portion in html code, which you didn't put in the repo, causes overlapping when zooming in to 100%. Would you mind deleting it or sharing the original html code too?

uploading gif files is not possible

Evanca, thank you for this awesome template. I enjoy it a lot.
However, I could not add .gif files to the index page. I added that file to the images folder and gave the path in the index file, still it did not show up, while there is no any problem with .png or .jpg file types.

PS If I did anything wrong, please apologize me, I am a newbie here.

Issue: Returning to home page in new tab

I noticed that when I select a link that takes me to the sample page and then select my name to return, I am forced to do so in a separate tab. Is there a way to control that so we can decide if we would rather it stay on the same tab?

Update Google Analytics Integration to GA4

Universal analytics is being deprecated, so anyone who uses this template will not be able to use the google analytics integration as it is now.

To update, you can paste the following in the _layouts/default.html just below the opening <head> tag.

    {% if site.google_analytics %}
      <script async src="https://www.googletagmanager.com/gtag/js?id={{ site.google_analytics }}"></script>
      <script>
        window.dataLayer = window.dataLayer || [];
        function gtag(){dataLayer.push(arguments);}
        gtag('js', new Date());

        gtag('config', '{{ site.google_analytics }}');
    </script>
  {% endif %}
  

Delete

    {% if site.google_analytics %}
  <script>
    (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
    m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
    })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
    ga('create', '{{ site.google_analytics }}', 'auto');
    ga('send', 'pageview');
  </script>
  {% endif %}

Setting Up Google Analytics

I added my measurement ID in the _config.yml page, but I'm not seeing any data being captured in GA when I visit my portfolio. Are there additional steps I need to take? Thank you!

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.