Skip to content
A simple unofficial widget for devRant written in php.
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Type Name Latest commit message Commit time
Failed to load latest commit information.


A simple unofficial widget for devRant written in php.

Getting Started

To include this widget in your projects, simply add the dependencies, a div with an id of "dw-enable", and a class of "col" in your index page. Also the devrant-widget folder should stay in the root directory, but you can change paths if desired. This widget depends on the bootstrap 4 grid system as well as jQuery so you must include those libraries. Lastly, this widget has only been tested on php 7.1 at the moment, so any other version used will be considered a wildcard.


You can view my demo here.


To get up an running, you can use this starter template below. Just make sure to have those libraries and the main div.

<!DOCTYPE html>
<html lang="en">
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no">
        <link rel="stylesheet" href="lib/css/bootstrap-reboot.min.css">
        <link rel="stylesheet" href="lib/css/bootstrap-grid.min.css">
        <link rel="stylesheet" href="|Comfortaa:700">
        <link rel="stylesheet" href="devrant-widget/css/dw-custom.css">
        <div class="container-fluid">
            <div class="row">

                <!-- START WIDGET GENERATION -->
                <div id="dw-enable" class="col"></div>
                <!-- END WIDGET GENERATION -->


        <script src="lib/js/jquery-3.2.1.min.js"></script>
        <?php require_once("devrant-widget/includes/functions.php"); dw_init();?>

Editing the Widget

To change some basic widget settings, ive included a dw-config.json file located in the devrant-widget directory. The list of settings are as follows:

    "general": {
        "username": "konicm8ker",
        "rants_display_count": 3,
        "widget_update_interval": 10
    "style": {
        "background_color": "#222",
        "foreground_color": "#54556e",
        "accent_color": "#a54a6d",
        "heading_color": "#fff",
        "text_color": "#ddd",
        "widget_position": "center",
        "widget_hidden": true,
        "widget_fade": true

Configuration Settings

username - This requires a devRant username and will load the profile data based on this value.

rants_display_count - This will set the number of rants to display on the widget. The accepted values are 1-5.

widget_update_interval - This sets the autoupdate timer to refresh the content data of the widget. The accepted values are 0,5,10,15,30 and 60. These values are in minute format and the value zero will disable the autoupdate feature.

background_color - This sets the background color of the main widget container.

foreground_color - This sets the foreground color of the widget.

accent_color - This changes the colors of the top banner, stats divider and lastly the rant upvoted score container.

heading_color - This sets the color for the heading text in the profile container.

text_color - This sets the general text color.

widget_position - This sets the position of the widget relative to location of its parent row container. The accepted values are left, center or right.

widget_hidden - This sets the visibility of the widget. The accepted values are true or false.

widget_fade - This sets the fade in effect using jQuery. The accepted values are true or false.

NOTE: Regarding color values, the accepted formats are hex (short form is accepted also), rgb and rgba at this point in time. Also because jQuery requires content to be hidden initially for the fade effect to work, setting widget_hidden to false and widget_fade to true will be invalid syntax. Lastly, any invalid values or syntax errors will result in my default profile being loaded.


This is my very first repository and would greatly appreciate any feedback, requests or contributions to this project. So feel free to fork this repository and contribute if interested :)


Im still unfamiliar to software versioning, but at the moment I'm considering this v.1.0.



This project is licensed under the MIT License - see the file for details

Acknowledgments / Credits

  • This widget uses pxgamers devrant-php api wrapper to recieve the devRant data.
  • This StackOverflow post helped me find a solution for converting emoji to html entities.
  • A special shoutout to devRant for inspiring me to make this in the first place :)
You can’t perform that action at this time.