Author Topic: [Style] Bilder- Dekoration / Decoration Images (Read 46811 times)

Sunny C. · « **on:** August 14, 2010, 09:32:00 PM »

Mit dieser Modifikation ist es endlich möglich Bilder mit einen Schatten oder einen Bilderrahmen auszustatten. Das alles ist mit nur einem Klick getan, es müssen keine weiteren Modifizierungen der Dateien vorgenommen werden, nur bei der ersten Installation. Derzeit stehen 16 verschiedene Styles zur Verfügung.

Getestet mit 4images 1.7.8

With this modification, it is finally possible images with a shadow or a picture frame equip. This is all done with just one click, there are no additional modifications of the files are made, first only during the installation. Currently there are 16 different styles available.

Tested with 4images 1.7.8

Step 1

Open / Öffne: includes/functions.php
Search / Suche:
$height = $image_info[1];
Add after / Füge danach ein:

$height_polaroid = $image_info[1] + 2;

$width_polaroid = $image_info[0] + 38;
$width_mod_schatten_12 = $image_info[0] - 20;
Search / Suche:
"height" => $height,
Add after / Füge danach ein:

"height_polaroid" => $height_polaroid,

"width_polaroid" => $width_polaroid,
"width_mod_schatten_12" => $width_mod_schatten_12,

Step 2

Open / Öffne: templates/*TEMPLATE*/details.html
Search / Suche:

Code: [Select]

{image}Replace with / Ersetze mit:

Code: [Select]

{ms_style}

Step 3

Open / Öffne: admin/settings.php
Search / Suche:
show_setting_row("image_table_cellpadding");
Add after / Füge danach ein:
show_setting_row("image_style", "show_image_style_select");
Search / Suche:
function show_upload_mode_options($setting_name, $setting_value) {
Add above / Füge davor ein:
function show_image_style_select($setting_name, $setting_value) {
  global $image_style_optionlist;
  echo "<select name=\"setting_item[".$setting_name."]\">";
  foreach ($image_style_optionlist as $key => $val) {
    echo "<option value=\"$key\"";
    if ($setting_value == $key) {
      echo " selected=\"selected\"";
    }
    echo ">".$val."</option>";
  }
  echo "</select>";
}

Step 4

Open / Öffne: lang/admin.php
Search / Suche:
$setting['image_table_cellspacing'] = "Cellspacing der Bilder Tabelle";
Add after / Füge danach ein:
include(TEMPLATE_PATH.'/mod_schatten/lang/mod_schatten_lang.php');

Step 5

Open / Öffne: details.php
Search / Suche:
show_image($image_row, $mode, 0, 1);
Add after / Füge danach ein:
if($config['image_style'] == 0){
$ms = get_media_code($image_row['image_media_file'], $image_row['image_id'], $image_row['cat_id'], $image_row['image_name'], $mode, $show_link, $detailed_view);
}
if($config['image_style'] > 0){
$ms = $site_template->parse_template("mod_schatten/mod_schatten_".$config['image_style']);
}
$site_template->register_vars("ms_style",$ms);

Fertig: Lade den Anhang herunter und kopiere den Ordner "mod_schatten" in deinem "templates/*TEMPLATE*/" Ordner
Finish: Download the attachment and copy the "mod_schatten" folder in your "templates/*TEMPLATE*/" folder

Rembrandt · « **Reply #1 on:** August 15, 2010, 07:06:33 AM »

der mod funktioniert nicht, du rufst eine funktion auf "show_mod_schatten_row" die es nicht gibt.

mfg Andi

Sunny C. · « **Reply #2 on:** August 15, 2010, 09:04:30 AM »

Doch die Modifikation funktioniert

, habe nur einen Step vergessen.

Fix:
Open / Öffne: admin/admin_functions.php
Search / Suche:
function show_input_row($title, $name, $value = "", $size = "") {
  global $error, $HTTP_POST_VARS, $textinput_size;
  $size = (empty($size)) ? $textinput_size : $size;
  if (isset($error[$name])) {
    $title = sprintf("<span class=\"marktext\">%s *</span>", $title);
  }
  if (isset($HTTP_POST_VARS[$name])/* && $value == ""*/) {
    $value = stripslashes($HTTP_POST_VARS[$name]);
  }
  echo "<tr class=\"".get_row_bg()."\">\n<td><p class=\"rowtitle\">".$title."</p></td>\n<td><p><input type=\"text\" size=\"".$size."\" name=\"".$name."\" value=\"".format_text($value, 2)."\"></p></td>\n</tr>\n";
}
Add above / Füge davor ein:
function show_mod_schatten_row($title, $name, $value = 1) {
  global $HTTP_POST_VARS, $lang;
  if (isset($HTTP_POST_VARS[$name])) {
    $value = $HTTP_POST_VARS[$name];
  }
  echo "
<tr style=\"background-color:#004C75\">
<td style=\"color: #FCDC54; font-weight:bold;\">".$title." <a href=\"".ROOT_PATH."".TEMPLATE_PATH."/mod_schatten/img/all_styles.png\" style=\"color: #FFF;\" target=\"_new\">[Styles]</a></td>
</tr>";
}

Rembrandt · « **Reply #3 on:** August 15, 2010, 09:48:34 AM »

...standard sollte vielleicht ein style angezeigt werden, sonst wird kein bild angezeigt.
...mehrfachauswahl ist möglich das sollte man vielleicht unterbinden, vielleicht das ganze als dropdown feld.
...im ACP könnte man den styles noch namen geben.
...style 3 funktioniert nicht (FF;IE)
...style 4 funktioniert nicht (FF)
...style 5 funktioniert nicht (FF;IE)
...style 6 funktioniert nicht (FF;IE)
...style 7 funktioniert nicht (FF)
...style 8 funktioniert nicht (FF;IE)
...style 9 funktioniert nicht (FF)
...style 9 funktioniert nicht (FF)
b.z.w. die bilder werden im FF über die seite gelegt, denke das ist ein css problem.

der mod würde schon gefallen nur die style fehler müßtest du noch ausbessern.

du hast in den html dateien einige fehler drinnen, die solltest du mal alle kontrollieren, z.b.:

Code: [Select]

<li><a href="#"><span></span>{image}</a></li>sollte so sein:

Code: [Select]

<li><a href="#"><span>{image}</span></a></li>

Sunny C. · « **Reply #4 on:** August 15, 2010, 10:06:27 AM »

In dem HTML Code sind keine Fehler, dass ist schon richtig so. Änder es mal, dann wirst du sehen das die Dekorationen nicht funktionieren. Der HTML- Code ist definitiv richtig, dass muss einfach so sein.

Zu den Style Problemen. Alle Styles habe ich im IE8 / FF getestet. Anbei ein Beweis das Style 3 im IE funktioniert

Und was meinst du damit, dass die Bilder über die Seite gelegt werden?

Wie bekomme ich das Dropdown denn hin? Das wäre wirklich klasse!

Rembrandt · « **Reply #5 on:** August 15, 2010, 10:18:18 AM »

style 3 z.b.:

Sunny C. · « **Reply #6 on:** August 15, 2010, 10:23:20 AM »

Ah, ok.
Da muss ich mal gucken wie ich dafür den Code abändere. Bei größeren Bildern scheint das zu sein, dass habe ich gar nicht berücksichtigt.... ich hoffe das ich das behoben bekomme!

Edit://
Ich bekomme das hin. Style 4 und Style 3 sind schon gefixed. Werde nachher alles hochladen!

Fixed 2: Post #1: Updated
Open / Öffne: includes/functions.php
Search / Suche:

$height_polaroid = $image_info[1];
$height_polaroid++;

$height_polaroid++;
Replace with / Ersetze mit:

$height_polaroid = $image_info[1] + 2;

$width_polaroid = $image_info[0] + 38;
Search / Suche:
"height_polaroid" => $height_polaroid,
Add after / Füge danach ein:
"width_polaroid" => $width_polaroid,

Downloade das Paket nun noch einmal neu. Ersetze den "mod_schatten" Ordner mit dem aktuellen.
Download the package now once again. Replace the "mod_schatten" folder with the current.

Rembrandt · « **Reply #7 on:** August 15, 2010, 12:05:58 PM »

änderung für die details.php und details.html , deinen code komplett raus, das hinein:

//########################################################
if($config['mod_schatten_0'] == 1){
  $ms = get_media_code($image_row['image_media_file'], $image_row['image_id'], $image_row['cat_id'], $image_row['image_name'], $mode, $show_link, $detailed_view);
}
  else{
    for ( $msx = 1; 1 > ($config['mod_schatten_'.$msx]); ) {
      $ms = $site_template->parse_template("mod_schatten/mod_schatten_".$msx);
      $msx++;
    }
  }
$site_template->register_vars("ms_style",$ms);

in der details.html brauchst du nur {ms_style} schreiben, somit kannst du 100 styles auch erzeugen.

mfg Andi

Sunny C. · « **Reply #8 on:** August 15, 2010, 12:32:20 PM »

Danke dafür!!

Update: (Post #1: Updated)

Step1

Open / Öffne: details.php
Search / Suche:
if($config['mod_schatten_0'] == 1) {

$ms0 = get_media_code($image_row['image_media_file'], $image_row['image_id'], $image_row['cat_id'], $image_row['image_name'], $mode, $show_link, $detailed_view);
}
if($config['mod_schatten_1'] == 1) {

$ms1 = $site_template->parse_template("mod_schatten/mod_schatten_1");
}
if($config['mod_schatten_2'] == 1) {

$ms2 = $site_template->parse_template("mod_schatten/mod_schatten_2");
}
if($config['mod_schatten_3'] == 1) {

$ms3 = $site_template->parse_template("mod_schatten/mod_schatten_3");
}
if($config['mod_schatten_4'] == 1) {

$ms2 = $site_template->parse_template("mod_schatten/mod_schatten_4");
}
if($config['mod_schatten_5'] == 1) {

$ms2 = $site_template->parse_template("mod_schatten/mod_schatten_5");
}
if($config['mod_schatten_6'] == 1) {

$ms2 = $site_template->parse_template("mod_schatten/mod_schatten_6");
}
if($config['mod_schatten_7'] == 1) {

$ms2 = $site_template->parse_template("mod_schatten/mod_schatten_7");
}
if($config['mod_schatten_8'] == 1) {

$ms2 = $site_template->parse_template("mod_schatten/mod_schatten_8");
}
if($config['mod_schatten_9'] == 1) {

$ms2 = $site_template->parse_template("mod_schatten/mod_schatten_9");
}
if($config['mod_schatten_10'] == 1) {

$ms2 = $site_template->parse_template("mod_schatten/mod_schatten_10");
}
$site_template->register_vars(array(
  "ms_style0" => $ms0,
  "ms_style1" => $ms1,
  "ms_style2" => $ms2,
  "ms_style3" => $ms3,
  "ms_style4" => $ms4,
  "ms_style5" => $ms5,
  "ms_style6" => $ms6,
  "ms_style7" => $ms7,
  "ms_style8" => $ms8,
  "ms_style9" => $ms9,
  "ms_style10" => $ms10,
));
Replace with / Ersetze mit:
if($config['mod_schatten_0'] == 1){
  $ms = get_media_code($image_row['image_media_file'], $image_row['image_id'], $image_row['cat_id'], $image_row['image_name'], $mode, $show_link, $detailed_view);
}
  else{
    for ( $msx = 1; 1 > ($config['mod_schatten_'.$msx]); ) {
      $ms = $site_template->parse_template("mod_schatten/mod_schatten_".$msx);
      $msx++;
    }
  }
$site_template->register_vars("ms_style",$ms);

Step2

Update: (Post #1: Updated)
Open / Öffne: templates/*TEMPLATE*/details.html
Search / Suche:

Code: [Select]

{ms_style0}
{ms_style1}
{ms_style2}
{ms_style3}
{ms_style4}
{ms_style5}
{ms_style6}
{ms_style7}
{ms_style8}
{ms_style9}
{ms_style10}

Replace with / Ersetze mit:

Code: [Select]

{ms_style}

Rembrandt · « **Reply #9 on:** August 15, 2010, 01:21:27 PM »

so.. leider muß ich dich nochmals bemühen, wegen der änderung im ACP auf eine options liste, muß man leider auch die details.php nochmals ändern.

admin_funktions.php entfällt.

in der details.php:

if($config['image_style'] == 0){
  $ms = get_media_code($image_row['image_media_file'], $image_row['image_id'], $image_row['cat_id'], $image_row['image_name'], $mode, $show_link, $detailed_view);
}
if($config['image_style'] > 0){
  $ms = $site_template->parse_template("mod_schatten/mod_schatten_".$config['image_style']);
}
$site_template->register_vars("ms_style",$ms);

in lang/admin.php:

$setting['image_style'] = "Bilder- Dekoration";
$image_style_optionlist = array(
"0"  => "Standard Bildansicht",
"1"  => "Style #1 verwenden",
"2"  => "Style #2 verwenden",
"3"  => "Style #3 verwenden",
"4"  => "Style #4 verwenden",
"5"  => "Style #5 verwenden",
"6"  => "Style #6 verwenden",
"7"  => "Style #7 verwenden",
"8"  => "Style #8 verwenden",
"9"  => "Style #9 verwenden",
"10"  => "Style #10 verwenden",
);

deine änderungen in der admin.settings.php alle rückgängig machen.

neu:
admin/settings.php nach

Code: [Select]

show_setting_row("image_table_cellpadding");das hier:
show_setting_row("image_style", "show_image_style_select");

neue function in settings.php vor:
function show_upload_mode_options($setting_name, $setting_value) {

diese function:

function show_image_style_select($setting_name, $setting_value) {
  global $image_style_optionlist;
  echo "<select name=\"setting_item[".$setting_name."]\">";
  foreach ($image_style_optionlist as $key => $val) {
    echo "<option value=\"$key\"";
    if ($setting_value == $key) {
      echo " selected=\"selected\"";
    }
    echo ">".$val."</option>";
  }
  echo "</select>";
}

das war es jetzt aber wirklich

in deinen ersten post würde ich das mit den updates lassen, streiche das ersatzlos den ich nehme mal an das es noch niemand installiert hat.

so die css styles sind deines, damit es auch in FF und IE klappt, bin ja mal gespannt ob du die hinbekommst damit man den mod verschieben kann.

mfg Andi

Sunny C. · « **Reply #10 on:** August 15, 2010, 02:28:59 PM »

Hey, super ich danke dir, werde das gleich mal übernehmen.

Zu den Styles, die habe ich überarbeitet.

Quote from: Sumale.nin on August 15, 2010, 10:23:20 AM

Ah, ok.
Da muss ich mal gucken wie ich dafür den Code abändere. Bei größeren Bildern scheint das zu sein, dass habe ich gar nicht berücksichtigt.... ich hoffe das ich das behoben bekomme!

Edit://
Ich bekomme das hin. Style 4 und Style 3 sind schon gefixed. Werde nachher alles hochladen!

Fixed 2: Post #1: Updated
Open / Öffne: includes/functions.php
Search / Suche:

    $height_polaroid = $image_info[1];
        $height_polaroid++;

$height_polaroid++;
Replace with / Ersetze mit:

    $height_polaroid = $image_info[1] + 2;

$width_polaroid = $image_info[0] + 38;
Search / Suche:
"height_polaroid" => $height_polaroid,
Add after / Füge danach ein:
"width_polaroid" => $width_polaroid,

Downloade das Paket nun noch einmal neu. Ersetze den "mod_schatten" Ordner mit dem aktuellen.
Download the package now once again. Replace the "mod_schatten" folder with the current.

Rembrandt · « **Reply #11 on:** August 15, 2010, 07:06:52 PM »

update mod_schatten_9 (attachment)

style 4 ,7 ,9 ,10 die einfachen

Sunny C. · « **Reply #12 on:** August 16, 2010, 06:10:22 PM »

1, perfekt
2. perfekt
3, perfekt
4, ist bei großen Bildern ok, aber bei kleinen nicht! (gleich mal gucken)
5, muss auch noch nachgeschaut werden (gleich mal gucken)
6, ist bei großen ok, aber bei kleinen nicht (gleich mal gucken)
7, perfekt
8, (gleich mal gucken)
9, perfekt
9.2, (Deine Variante) perfekt (Wird als 9.2 eingebaut)
10, bei großen Bildern ok, aber bei kleinen nicht (gleich mal gucken)

Rembrandt · « **Reply #13 on:** August 16, 2010, 06:36:27 PM »

also die einser funktioniert bei größeren bilder nicht, aber da bin ich drann.
die 8 mach ich auch nochmal.

10.css

Code: [Select]

.mod_schatten_10 {
position: relative;
top:30px;
left:0px;
}
.mod_schatten_10 span {
width: 122px;
height: 72px;
display: block;
position: absolute;
top:-10px;
left:50%;
	background: url(../img/10.png) no-repeat;
}

4.css

Code: [Select]

.mod_schatten_4 span {
width: 122px;
height: 72px;
display: block;
position: absolute;
top:-15;
left:45%;
background: url(../img/4.png) no-repeat;
}

Sunny C. · « **Reply #14 on:** August 16, 2010, 07:54:10 PM »

Vielen Dank für deine Unterstützung.

Jetzt habe ich etwas Zeit und kann mich dem ebenfalls widmen.

4, sieht nun besser aus, funktioniert bei großen als auch bei kleinen, allerdings ist es bei kleinen zu weit rechts, wobei das aber nicht wirklich was ausmacht. Mittig wäre da am besten, mal sehen

10, habe ich noch etwas angepasst, nun ist es mittig, bei kleinen als auch bei großen:

Code: [Select]

.mod_schatten_10 {
position: relative;
top:30px;
left:0px;
}
.mod_schatten_10 span {
width: 122px;
height: 72px;
display: block;
position: absolute;
top:-10px;
left:50%;
right:50%;
	background: url(../img/10.png) no-repeat;
}

Edit://
Ich denke 4 kann man so lassen:

Code: [Select]

.mod_schatten_4 span {
width: 122px;
height: 72px;
display: block;
position: absolute;
top:-15px;
left:25%;
background-image: url(../img/4.png);
background-repeat:no-repeat;
background-position:top center;
}

Ist zwar immer noch nicht ganz mittig, aber so finde ich passt es aber zu jedem Bild

Edit://
Zu 8 habe ich bis jetzt noch keine Idee, ausser die Grafiken zu verlängern.
Ich habe ebenfalls 8 weitere Styles erstellt. Das wird von meiner Seite auch vorerst so bleiben.
Solltest du noch Ideen haben, warte ich ab bis ich das Update raus haue.

LG

4images Forum & Community

News:

Author Topic: [Style] Bilder- Dekoration / Decoration Images (Read 46811 times)

Sunny C.

[Style] Bilder- Dekoration / Decoration Images

Rembrandt

Re: [Style] Bilder- Dekoration / Decoration Images

Sunny C.

Re: [Style] Bilder- Dekoration / Decoration Images

Rembrandt

Re: [Style] Bilder- Dekoration / Decoration Images

Sunny C.

Re: [Style] Bilder- Dekoration / Decoration Images

Rembrandt

Re: [Style] Bilder- Dekoration / Decoration Images

Sunny C.

Re: [Style] Bilder- Dekoration / Decoration Images

Rembrandt

Re: [Style] Bilder- Dekoration / Decoration Images

Sunny C.

Re: [Style] Bilder- Dekoration / Decoration Images

Rembrandt

Re: [Style] Bilder- Dekoration / Decoration Images

Sunny C.

Re: [Style] Bilder- Dekoration / Decoration Images

Rembrandt

Re: [Style] Bilder- Dekoration / Decoration Images

Sunny C.

Re: [Style] Bilder- Dekoration / Decoration Images

Rembrandt

Re: [Style] Bilder- Dekoration / Decoration Images

Sunny C.

Re: [Style] Bilder- Dekoration / Decoration Images