diff --git a/logic_ohli24.py b/logic_ohli24.py
index e78367b..6259855 100644
--- a/logic_ohli24.py
+++ b/logic_ohli24.py
@@ -225,10 +225,76 @@ class LogicOhli24(LogicModuleBase):
                 return jsonify(ModelOhli24Item.web_list(request))
             elif sub == "db_remove":
                 return jsonify(ModelOhli24Item.delete_by_id(req.form["id"]))
+            elif sub == "add_whitelist":
+                try:
+                    # params = request.get_data()
+                    # logger.debug(f"params: {params}")
+                    # data_code = request.args.get("data_code")
+                    params = request.get_json()
+                    logger.debug(f"params:: {params}")
+                    if params is not None:
+                        code = params["data_code"]
+                        logger.debug(f"params: {code}")
+                        ret = LogicOhli24.add_whitelist(code)
+                    else:
+                        ret = LogicOhli24.add_whitelist()
+                    return jsonify(ret)
+                except Exception as e:
+                    logger.error("Exception:%s", e)
+                    logger.error(traceback.format_exc())
         except Exception as e:
             P.logger.error("Exception:%s", e)
             P.logger.error(traceback.format_exc())
 
+    @staticmethod
+    def add_whitelist(*args):
+        ret = {}
+
+        logger.debug(f"args: {args}")
+        try:
+
+            if len(args) == 0:
+                code = str(LogicOhli24.current_data["code"])
+            else:
+                code = str(args[0])
+
+            print(code)
+
+            whitelist_program = P.ModelSetting.get("ohli24_auto_code_list")
+            whitelist_programs = [
+                str(x.strip().replace(" ", ""))
+                for x in whitelist_program.replace("\n", "|").split("|")
+            ]
+            if code not in whitelist_programs:
+                whitelist_programs.append(code)
+                whitelist_programs = filter(
+                    lambda x: x != "", whitelist_programs
+                )  # remove blank code
+                whitelist_program = "|".join(whitelist_programs)
+                entity = (
+                    db.session.query(P.ModelSetting)
+                    .filter_by(key="ohli24_auto_code_list")
+                    .with_for_update()
+                    .first()
+                )
+                entity.value = whitelist_program
+                db.session.commit()
+                ret["ret"] = True
+                ret["code"] = code
+                if len(args) == 0:
+                    return LogicOhli24.current_data
+                else:
+                    return ret
+            else:
+                ret["ret"] = False
+                ret["log"] = "이미 추가되어 있습니다."
+        except Exception as e:
+            logger.error("Exception:%s", e)
+            logger.error(traceback.format_exc())
+            ret["ret"] = False
+            ret["log"] = str(e)
+        return ret
+
     def setting_save_after(self):
         if self.queue.get_max_ffmpeg_count() != P.ModelSetting.get_int(
             "ohli24_max_ffmpeg_process_count"
diff --git a/templates/anime_downloader_ohli24_category.html b/templates/anime_downloader_ohli24_category.html
index b18c225..4e7d5a2 100644
--- a/templates/anime_downloader_ohli24_category.html
+++ b/templates/anime_downloader_ohli24_category.html
@@ -145,9 +145,15 @@
             // {#tmp += '<button id="code_button" data-code="' + data.episode[i].code + '" type="button" class="btn btn-primary code-button bootstrap-tooltip" data-toggle="button" data-tooltip="true" aria-pressed="true" autocomplete="off" data-placement="top">' +#}
             //  {#    '<span data-tooltip-text="'+data.episode[i].title+'">' + data.episode[i].code + '</span></button></div>';#}
             tmp += '<h5 class="card-title">' + data.anime_list[i].title + '</h5>';
-            tmp += '<p class="card-text">' + data.anime_list[i].code + '</p>';
+            tmp += '<p class="card-text">' + data.anime_list[i].code + '<button id="add_whitelist" name="add_whitelist" class="btn btn-sm btn-favorite mb-1" data-code="' +
+            data.anime_list[i].code +
+            '"><i class="bi bi-heart-fill"></i></button></p>';
             tmp += '<a href="./request?code=' + data.anime_list[i].code + '" class="btn btn-primary cut-text">' + data.anime_list[i].title + '</a>';
-            tmp += '</div>';
+            // tmp +=
+            // '<button id="add_whitelist" name="add_whitelist" class="btn btn-sm btn-favorite mb-1" data-code="' +
+            // data.anime_list[i].code +
+            // '"><i class="bi bi-heart-fill"></i></button>';
+            tmp += '</div><!-- .card -->';
             tmp += '</div>';
             tmp += '</div>';
             str += tmp
@@ -394,6 +400,32 @@
         window.open("{{arg['anilife_url']}}", "_blank");
     });
 
+    $("body").on("click", "#add_whitelist", function (e) {
+        e.preventDefault();
+        let data_code = $(this).attr("data-code");
+        console.log(data_code);
+        $.ajax({
+            url: "/" + package_name + "/ajax/"+sub+"/add_whitelist",
+            type: "POST",
+            cache: false,
+            data: JSON.stringify({data_code: data_code}),
+            contentType: "application/json;charset=UTF-8",
+            dataType: "json",
+            success: function (ret) {
+                if (ret.ret) {
+                    $.notify("<strong>추가하였습니다.</strong><br>", {
+                        type: "success",
+                    });
+                    // make_program(ret);
+                } else {
+                    $.notify("<strong>추가 실패</strong><br>" + ret.log, {
+                        type: "warning",
+                    });
+                }
+            },
+        });
+    });
+
     $("body").on('click', '#all_check_on_btn', function (e) {
         e.preventDefault();
         $('input[id^="checkbox_"]').bootstrapToggle('on')
@@ -676,12 +708,20 @@
             column-count: 5;
         }
     }
+    .card {
+        margin-bottom: 0.75rem;
+    }
     .card-columns .card {
         margin-bottom: 0.75rem;
     }
     .card-columns .card img{
         width: 100%;
     }
+    button#add_whitelist {
+        /*top: -70px;*/
+        position: relative;
+    }
 
 </style>
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.7.1/font/bootstrap-icons.css">
 {% endblock %}